From 14965ca45161f5b87271d231b9088844f373e8ce Mon Sep 17 00:00:00 2001 From: Oliver Hamlet Date: Tue, 30 Dec 2014 20:11:59 +0000 Subject: [PATCH] Reduced sidebar plugin item height by 8px again. In non-edit mode only. To workaround the transform jump, transition the transforms, but only during the card flip animation, and update them when beginning the item content transitions, so that everything happens at the same time. --- resources/report/css/style.css | 3 +++ resources/report/html/loot-plugin-card.html | 3 +++ resources/report/html/loot-plugin-item.html | 4 ++-- resources/report/js/script.js | 6 ++++++ 4 files changed, 14 insertions(+), 2 deletions(-) diff --git a/resources/report/css/style.css b/resources/report/css/style.css index 115bca9c..c137c7a0 100644 --- a/resources/report/css/style.css +++ b/resources/report/css/style.css @@ -85,6 +85,9 @@ paper-item > a { paper-item > a:hover { text-decoration: none; } +#cardsNav[data-editModeToggle] > loot-plugin-item { + transition: transform 0.6s; +} #searchBox { display: block; margin: 0 16px; diff --git a/resources/report/html/loot-plugin-card.html b/resources/report/html/loot-plugin-card.html index 26a19be9..e5e91588 100644 --- a/resources/report/html/loot-plugin-card.html +++ b/resources/report/html/loot-plugin-card.html @@ -290,6 +290,9 @@ loot-clear-metadata /* Also re-calculate editor tooltip positions. */ this.shadowRoot.getElementById('editor').updatePolymerElements(); + + /* Remove the edit mode toggle if present. */ + document.getElementById('cardsNav').removeAttribute('data-editModeToggle'); }, onShowEditor: function(evt) { diff --git a/resources/report/html/loot-plugin-item.html b/resources/report/html/loot-plugin-item.html index 23b7c5c7..653b1d7e 100644 --- a/resources/report/html/loot-plugin-item.html +++ b/resources/report/html/loot-plugin-item.html @@ -24,8 +24,8 @@ /* Two-line items should be 72px high according to Material Design. Squeeze the height to fit more items in. */ /*height: 72px;*/ - height: 40px; - line-height: 40px; + height: 32px; + line-height: 32px; font-size: 1rem; } :host-context(body[data-editors]) paper-item.two-line { diff --git a/resources/report/js/script.js b/resources/report/js/script.js index 731e8c93..1fa08f6c 100644 --- a/resources/report/js/script.js +++ b/resources/report/js/script.js @@ -844,6 +844,8 @@ function handleEditorOpen(evt) { ++numEditors; if (numEditors == 1) { + /* Set the edit mode toggle attribute. */ + document.getElementById('cardsNav').setAttribute('data-editModeToggle', ''); /* Disable the toolbar elements. */ document.getElementById('wipeUserlistButton').setAttribute('disabled', ''); document.getElementById('copyContentButton').setAttribute('disabled', ''); @@ -854,6 +856,7 @@ function handleEditorOpen(evt) { document.getElementById('sortButton').setAttribute('disabled', ''); } document.body.setAttribute('data-editors', numEditors); + document.getElementById('cardsNav').updateSize(); return loot.query('editorOpened').catch(processCefError); } @@ -907,6 +910,8 @@ function handleEditorClose(evt) { if (numEditors == 0) { document.body.removeAttribute('data-editors'); + /* Set the edit mode toggle attribute. */ + document.getElementById('cardsNav').setAttribute('data-editModeToggle', ''); /* Re-enable toolbar elements. */ document.getElementById('wipeUserlistButton').removeAttribute('disabled'); document.getElementById('copyContentButton').removeAttribute('disabled'); @@ -918,6 +923,7 @@ function handleEditorClose(evt) { } else { document.body.setAttribute('data-editors', numEditors); } + document.getElementById('cardsNav').updateSize(); } function handleConflictsFilter(evt) { /* evt.detail is true if the filter has been activated. */