Bug 1468705 - Set tab-line opacity to 0.5 on multi-select and hover context. r?jaws draft multiselect_tab_line_hovered_0.5
authorAbdoulaye O. Ly <ablayelyfondou@gmail.com>
Tue, 26 Jun 2018 03:04:10 +0000
branchmultiselect_tab_line_hovered_0.5
changeset 810534 1aab9608220bf4b15fea28af00f539eefb666ad2
parent 809933 5dc06b87c88ef4707aeebdd9f8b8c6935edda0c4
push id114024
push userbmo:ablayelyfondou@gmail.com
push dateTue, 26 Jun 2018 03:05:00 +0000
reviewersjaws
bugs1468705
milestone62.0a1
Bug 1468705 - Set tab-line opacity to 0.5 on multi-select and hover context. r?jaws MozReview-Commit-ID: E7i8GORVynz
browser/themes/shared/tabs.inc.css
--- a/browser/themes/shared/tabs.inc.css
+++ b/browser/themes/shared/tabs.inc.css
@@ -568,26 +568,31 @@
 }
 
 .tab-line:not([selected=true]):not([multiselected]) {
   opacity: 0;
   transform: scaleX(0);
   transition: transform 250ms var(--animation-easing-function), opacity 250ms var(--animation-easing-function);
 }
 
-.tabbrowser-tab:hover > .tab-stack > .tab-background > .tab-line:not([selected=true]) {
+.tabbrowser-tab:hover > .tab-stack > .tab-background > .tab-line:not([selected=true]):not([multiselected]) {
   background-color: rgba(0,0,0,.2);
   opacity: 1;
   transform: none;
 }
 
-#TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab:hover > .tab-stack > .tab-background > .tab-line:not([selected=true]) {
+#TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab:hover > .tab-stack > .tab-background > .tab-line:not([selected=true]):not([multiselected]) {
   background-color: rgba(255,255,255,.2);
 }
 
+.tabbrowser-tab:hover > .tab-stack > .tab-background > .tab-line:not([selected=true])[multiselected],
+#TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab:hover > .tab-stack > .tab-background > .tab-line:not([selected=true])[multiselected] {
+  opacity: 0.5;
+}
+
 /* Tab multi-selected */
 
 .tabbrowser-tab[multiselected] > .tab-stack > .tab-background:not([selected=true]) {
   background-color: rgba(0,0,0,.1);
 }
 
 #TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab[multiselected] > .tab-stack > .tab-background:not([selected=true]) {
   background-color: rgba(255,255,255,.1);