loot/libloot
0
0
Fork 0
mirror of https://github.com/loot/libloot.git synced 2026-07-27 14:16:01 -07:00
Code Issues Packages Projects Releases Wiki Activity

Moved filter tabs into a separate sidebar toolbar.

Browse Source 
The sidebar content is now kept in a card too.
This commit is contained in:
Oliver Hamlet
2014-11-18 21:50:57 +00:00
parent e54a1988d6
commit b5756c56b7
5 changed files with 95 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/report/bower.json
+3 -1
View File
@@ -32,6 +32,8 @@
"paper-progress": "Polymer/paper-progress#~0.5.0",
"core-animated-pages": "Polymer/core-animated-pages#~0.5.1",
"paper-toast": "Polymer/paper-toast#~0.5.1",
"core-list": "WrinklyNinja/core-list#51e27f42c86a91cbbe0933f618b2e82905dda83a"
"core-list": "WrinklyNinja/core-list#51e27f42c86a91cbbe0933f618b2e82905dda83a",
"core-header-panel": "Polymer/core-header-panel#~0.5.1",
"core-scaffold": "Polymer/core-scaffold#~0.5.1"
}
}
resources/report/css/overrides.css
+17 -4
View File
@@ -1,9 +1,22 @@
/* These styles override Polymer's own internal styling for certain elements. */
/* The following is for the app and drawer bars. */
core-toolbar, core-scaffold::shadow core-toolbar {
background: #4285f4;
color: white;
height: 56px;
}
/* The following is for setting the size of the drawer in narrow mode. */
#container::shadow .narrow-layout #drawer {
html /deep/ .narrow-layout #drawer {
width: 50% !important;
background: #f8f8f8;
background: white;
}
/* Let the <core-animated-pages> element stretch to fit the sidebar. */
core-header-panel::shadow #mainContainer {
display: flex;
flex-direction: column;
}
/* These overrides change the colour of the game menu's text and underline. */
@@ -50,11 +63,11 @@ html /deep/ paper-item[disabled] {
}
/* These overrides change the colour of the tab ink effect and their underline. */
#mainToolbar paper-tabs::shadow #selectionBar {
core-toolbar > paper-tabs::shadow #selectionBar {
background-color: white;
height: 4px;
}
#mainToolbar paper-tab::shadow #ink {
core-toolbar paper-tab::shadow #ink {
color: #f1f1f1;
}
resources/report/css/style.css
+2 -20
View File
@@ -30,18 +30,10 @@ body {
background:#f8f8f8;
height: 100%;
}
#mainToolbar {
background: #4285f4;
color: white;
width: 99.99vw; /* Fix for scollbars when LOOT is run through Mod Organiser. */
height: 56px;
}
#mainToolbar paper-dropdown {
color: black;
}
#sidebarTabs {
width: calc(33% - 11px);
}
div[drawer] > core-tooltip {
margin: 0 12px;
@@ -73,6 +65,7 @@ paper-item > a {
}
#searchBox {
display: block;
padding: 0 1em;
}
#container {
position: fixed;
@@ -224,14 +217,3 @@ paper-progress {
#firstRun .tag {
margin: 0;
}
/* This animates the drawer toggle appearing in narrow view. */
#drawerToggle {
display: none;
}
@media screen and (max-width: 640px) {
#drawerToggle {
display: block;
}
}
resources/report/js/script.js
-4
View File
@@ -977,9 +977,6 @@ function handleClearMetadata(evt) {
}
});
}
function toggleDrawer(evt) {
document.getElementById('container').togglePanel();
}
function handleSidebarClick(evt) {
if (evt.target.hasAttribute('data-index')) {
window.location.hash = '';
@@ -1038,7 +1035,6 @@ function setupEventHandlers() {
document.body.addEventListener('loot-copy-metadata', handleCopyMetadata, false);
document.body.addEventListener('loot-clear-metadata', handleClearMetadata, false);
document.getElementById('drawerToggle').addEventListener('click', toggleDrawer, false);
document.getElementById('cardsNav').addEventListener('click', handleSidebarClick, false);
}
function initVars() {
resources/report/report.html
+73 -70
View File
@@ -19,9 +19,11 @@
<link rel="import" href="bower_components/core-icons/core-icons.html">
<link rel="import" href="bower_components/core-tooltip/core-tooltip.html">
<link rel="import" href="bower_components/core-drawer-panel/core-drawer-panel.html">
<link rel="import" href="bower_components/core-header-panel/core-header-panel.html">
<link rel="import" href="bower_components/core-animated-pages/core-animated-pages.html">
<link rel="import" href="bower_components/core-animated-pages/transitions/slide-from-right.html">
<link rel="import" href="bower_components/core-list/core-list.html">
<link rel="import" href="bower_components/core-scaffold/core-scaffold.html">
<link rel="import" href="bower_components/paper-menu-button/paper-menu-button.html">
<link rel="import" href="bower_components/paper-item/paper-item.html">
@@ -39,74 +41,15 @@
<script src="bower_components/requirejs/require.js"></script>
</head>
<!-- oncontextmenu attribute disables the right-click menu. -->
<body oncontextmenu="return false" unresolved fullbleed vertical layout >
<core-toolbar id="mainToolbar">
<paper-icon-button icon="drawer" id="drawerToggle"></paper-icon-button>
<paper-tabs id="sidebarTabs" selected="cardsNav" valueattr="data-id">
<paper-tab data-id="cardsNav">Plugins</paper-tab>
<paper-tab data-id="filters">Filters</paper-tab>
</paper-tabs>
<loot-dropdown-menu id="gameMenu">
<!-- Generated game <li> elements go here. -->
</loot-dropdown-menu>
<span flex></span>
<core-tooltip label="Sort Plugins">
<paper-icon-button id="sortButton" icon="sort"></paper-icon-button>
</core-tooltip>
<core-tooltip label="Update Masterlist">
<paper-icon-button id="updateMasterlistButton" icon="file-download"></paper-icon-button>
</core-tooltip>
<paper-button id="applySortButton" class="hidden">Apply</paper-button>
<paper-button id="cancelSortButton" class="hidden">Cancel</paper-button>
<paper-menu-button>
<paper-icon-button icon="more-vert"></paper-icon-button>
<paper-dropdown class="dropdown" halign="right">
<div>
<paper-item id="redatePluginsButton">
<core-icon icon="today"></core-icon>
Redate Plugins
</paper-item>
<paper-item id="wipeUserlistButton">
<core-icon icon="delete"></core-icon>
Clear All User Metadata
</paper-item>
<paper-item id="copyContentButton">
<core-icon icon="content-copy"></core-icon>
Copy Content
</paper-item>
<paper-item id="refreshContentButton">
<core-icon icon="cached"></core-icon>
Refresh Content
</paper-item>
<paper-item separator></paper-item>
<paper-item id="settingsButton">
<core-icon icon="settings"></core-icon>
Settings
</paper-item>
<paper-item separator></paper-item>
<paper-item id="helpButton">
<core-icon icon="book"></core-icon>
View Documentation
</paper-item>
<paper-item id="openLogButton">
<core-icon icon="folder"></core-icon>
Open Debug Log Location
</paper-item>
<paper-item id="aboutButton">
<core-icon icon="help"></core-icon>
About
</paper-item>
<paper-item separator></paper-item>
<paper-item id="quitButton">
<core-icon icon="close"></core-icon>
Quit
</paper-item>
</div>
</paper-dropdown>
</paper-menu-button>
</core-toolbar>
<core-drawer-panel id="container" drawerWidth="33%">
<div drawer vertical layout>
<body oncontextmenu="return false" unresolved fullbleed vertical layout>
<core-scaffold drawerWidth="33%" mode="standard">
<core-header-panel navigation flex>
<core-toolbar>
<paper-tabs id="sidebarTabs" selected="cardsNav" valueattr="data-id">
<paper-tab data-id="cardsNav">Plugins</paper-tab>
<paper-tab data-id="filters">Filters</paper-tab>
</paper-tabs>
</core-toolbar>
<core-animated-pages selected="cardsNav" valueattr="id" transitions="" flex>
<div id="cardsNav" class="tab-content" layout vertical>
<paper-item>
@@ -146,8 +89,68 @@
<core-tooltip label="Press Enter or click outside the input to set the filter." position="top">
<paper-input id="searchBox" label="Filter content..."></paper-input>
</core-tooltip>
</core-header-panel>
<div tool id="mainToolbar" layout horizontal center flex>
<loot-dropdown-menu id="gameMenu">
<!-- Generated game <li> elements go here. -->
</loot-dropdown-menu>
<span flex></span>
<core-tooltip label="Sort Plugins">
<paper-icon-button id="sortButton" icon="sort"></paper-icon-button>
</core-tooltip>
<core-tooltip label="Update Masterlist">
<paper-icon-button id="updateMasterlistButton" icon="file-download"></paper-icon-button>
</core-tooltip>
<paper-button id="applySortButton" class="hidden">Apply</paper-button>
<paper-button id="cancelSortButton" class="hidden">Cancel</paper-button>
<paper-menu-button>
<paper-icon-button icon="more-vert"></paper-icon-button>
<paper-dropdown class="dropdown" halign="right">
<div>
<paper-item id="redatePluginsButton">
<core-icon icon="today"></core-icon>
Redate Plugins
</paper-item>
<paper-item id="wipeUserlistButton">
<core-icon icon="delete"></core-icon>
Clear All User Metadata
</paper-item>
<paper-item id="copyContentButton">
<core-icon icon="content-copy"></core-icon>
Copy Content
</paper-item>
<paper-item id="refreshContentButton">
<core-icon icon="cached"></core-icon>
Refresh Content
</paper-item>
<paper-item separator></paper-item>
<paper-item id="settingsButton">
<core-icon icon="settings"></core-icon>
Settings
</paper-item>
<paper-item separator></paper-item>
<paper-item id="helpButton">
<core-icon icon="book"></core-icon>
View Documentation
</paper-item>
<paper-item id="openLogButton">
<core-icon icon="folder"></core-icon>
Open Debug Log Location
</paper-item>
<paper-item id="aboutButton">
<core-icon icon="help"></core-icon>
About
</paper-item>
<paper-item separator></paper-item>
<paper-item id="quitButton">
<core-icon icon="close"></core-icon>
Quit
</paper-item>
</div>
</paper-dropdown>
</paper-menu-button>
</div>
<div main id="main">
<div id="main">
<section id="summary">
<h1>Summary</h1>
<table>
@@ -215,7 +218,7 @@
<!-- Generated <loot-plugin-card> elements go here. -->
</core-list>
</div>
</core-drawer-panel>
</core-scaffold>
<paper-toast id="toast"></paper-toast>
<loot-dialog id="progressDialog">
<paper-progress indeterminate></paper-progress>