From 7212fcdf023893cb0fd6a98239bf8eec34692c58 Mon Sep 17 00:00:00 2001
From: Oliver Hamlet <oliver.hamlet@gmail.com>
Date: Mon, 17 Nov 2014 20:48:33 +0000
Subject: [PATCH] Improved styling of editor tabs.

---
 resources/report/css/overrides.css            |  4 ++--
 resources/report/html/loot-plugin-card.html   |  2 +-
 resources/report/html/loot-plugin-editor.html | 22 ++++++++++++++++++-
 3 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/resources/report/css/overrides.css b/resources/report/css/overrides.css
index 826847cb..17ab7e57 100644
--- a/resources/report/css/overrides.css
+++ b/resources/report/css/overrides.css
@@ -50,11 +50,11 @@ html /deep/ paper-item[disabled]  {
 }
 
 /* These overrides change the colour of the tab ink effect and their underline. */
-html /deep/ paper-tabs::shadow #selectionBar {
+#mainToolbar paper-tabs::shadow #selectionBar {
     background-color: white;
     height: 4px;
 }
-html /deep/ paper-tab::shadow #ink {
+#mainToolbar paper-tab::shadow #ink {
     color: #f1f1f1;
 }
 
diff --git a/resources/report/html/loot-plugin-card.html b/resources/report/html/loot-plugin-card.html
index cc3cb58a..b564bcc3 100644
--- a/resources/report/html/loot-plugin-card.html
+++ b/resources/report/html/loot-plugin-card.html
@@ -265,7 +265,7 @@ loot-clear-metadata
             this.shadowRoot.getElementById('loadsBSA').setPosition();
 
             /* Also re-calculate editor tooltip positions. */
-            this.shadowRoot.getElementById('editor').setTooltipPositions();
+            this.shadowRoot.getElementById('editor').updatePolymerElements();
         },
 
         onShowEditor: function(evt) {
diff --git a/resources/report/html/loot-plugin-editor.html b/resources/report/html/loot-plugin-editor.html
index 8c337808..144e5c25 100644
--- a/resources/report/html/loot-plugin-editor.html
+++ b/resources/report/html/loot-plugin-editor.html
@@ -131,6 +131,19 @@ loot-editor-close
         core-icon {
             vertical-align: inherit !important;
         }
+        #tableTabs {
+            border: 2px solid #f1f1f1;
+        }
+        paper-tabs {
+            background: #f1f1f1;
+        }
+        /* These overrides change the colour of the tab ink effect and their underline. */
+        paper-tabs::shadow #selectionBar {
+            background-color: #4285f4;
+        }
+        paper-tab::shadow #ink {
+            color: #4285f4;
+        }
         </style>
         <core-toolbar>
             <core-tooltip id="activeTick" label="Active Plugin">
@@ -528,11 +541,18 @@ loot-editor-close
             }
         },
 
-        setTooltipPositions: function() {
+        updatePolymerElements: function() {
+            /* Set tooltip positions. */
             this.shadowRoot.getElementById('activeTick').setPosition();
             this.shadowRoot.getElementById('dummyPlugin').setPosition();
             this.shadowRoot.getElementById('loadsBSA').setPosition();
             this.shadowRoot.getElementById('globalPriority').parentElement.setPosition();
+
+            /* Update tab bar position. */
+            this.shadowRoot.getElementById('tableTabs').firstElementChild.updateBar();
+
+            /* Also make sure right arrow is visible. */
+            this.shadowRoot.getElementById('tableTabs').firstElementChild.shadowRoot.querySelector('.scroll-button:last-child').firstElementChild.classList.remove('hidden');
         },
     });
     </script>