Bug 1222805 - Port bug 1184651 to TB [Use flat background instead of gradient for the navigation toolbar on Windows 10 and 8]. r=clokep
authorRichard Marti <richard.marti@gmail.com>
Sat, 24 Oct 2015 12:35:59 +0200
changeset 18624 d1b7fb707ff54a171f359562eafbad206c0c10b6
parent 18623 a69b34c19f9a63a1e882186dc20169ee2164c1b2
child 18625 8d13bd3c9e2d82f09ad6acf7e7c80bff8576c12d
push id11404
push useraleth@instantbird.org
push dateSun, 22 Nov 2015 20:26:21 +0000
treeherdercomm-central@d1b7fb707ff5 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersclokep
bugs1222805, 1184651
Bug 1222805 - Port bug 1184651 to TB [Use flat background instead of gradient for the navigation toolbar on Windows 10 and 8]. r=clokep
mail/themes/linux/mail/linuxShared.css
mail/themes/linux/mail/messenger.css
mail/themes/linux/mail/tabmail.css
mail/themes/osx/mail/osxShared.css
mail/themes/windows/mail/primaryToolbar.css
mail/themes/windows/mail/tabmail.css
mail/themes/windows/mail/windowsShared.css
--- a/mail/themes/linux/mail/linuxShared.css
+++ b/mail/themes/linux/mail/linuxShared.css
@@ -1,10 +1,10 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 :root {
-  --toolbarHighlight: rgba(255, 255, 255, .3);
-  --fgTabTexture: linear-gradient(transparent 0px, transparent 2px, hsla(0, 0%, 100%, 0.35) 2px, hsla(0, 0%, 100%, 0.35) 3px, hsla(0, 0%, 100%, 0.65) 3px, hsla(0, 0%, 100%, 0.65) 4px, var(--toolbarHighlight));
+  --toolbarHighlight: rgba(255, 255, 255, .4);
+  --fgTabTexture: linear-gradient(transparent 2px, var(--toolbarHighlight) 2px, var(--toolbarHighlight));
   --fgTabTextureLWT: var(--fgTabTexture);
   --fgTabBackgroundColor: -moz-dialog;
 }
--- a/mail/themes/linux/mail/messenger.css
+++ b/mail/themes/linux/mail/messenger.css
@@ -68,18 +68,18 @@ menulist > menupopup > menu > .menu-icon
   display: -moz-box;
 }
 
 /* ::::: Mail Toolbars and Menubars ::::: */
 
 .mail-toolbox,
 .contentTabToolbox {
   -moz-appearance: none;
-  background-image: linear-gradient(rgba(255, 255, 255, .3),
-                                    rgba(255, 255, 255, 0));
+  background-image: linear-gradient(var(--toolbarHighlight),
+                                    var(--toolbarHighlight));
   box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset;
 }
 
 .mail-toolbox::after,
 .contentTabToolbox::after {
   content: "";
   display: -moz-box;
   height: 1px;
--- a/mail/themes/linux/mail/tabmail.css
+++ b/mail/themes/linux/mail/tabmail.css
@@ -90,18 +90,20 @@ tabpanels {
   list-style-image: none;
 }
 
 .tabs-closebutton:not([selected]):not(:hover),
 .tab-close-button:not([selected]):not(:hover) {
   background-image: -moz-image-rect(url("chrome://global/skin/icons/close.svg"), 0, 64, 16, 48);
 }
 
-#tabs-toolbar[brighttext] .tabs-closebutton:not([selected]):not(:hover),
-#tabs-toolbar[brighttext] .tab-close-button:not([selected]):not(:hover) {
+.tabs-closebutton:not(:hover):-moz-lwtheme-brighttext,
+.tab-close-button:not(:hover):-moz-lwtheme-brighttext,
+#tabs-toolbar[brighttext] .tabs-closebutton:not(:hover),
+#tabs-toolbar[brighttext] .tab-close-button:not(:hover) {
   background-image: -moz-image-rect(url("chrome://global/skin/icons/close.svg"), 0, 80, 16, 64);
 }
 
 .tabs-closebutton:not([selected]):not(:hover):-moz-lwtheme-darktext,
 .tab-close-button:not([selected]):not(:hover):-moz-lwtheme-darktext {
   background-image: -moz-image-rect(url("chrome://global/skin/icons/close.svg"), 0, 96, 16, 80);
 }
 
--- a/mail/themes/osx/mail/osxShared.css
+++ b/mail/themes/osx/mail/osxShared.css
@@ -1,10 +1,10 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 :root {
-  --fgTabTexture: linear-gradient(transparent, transparent 2px, hsla(0, 0%, 100%, 0.6) 2px, hsla(0, 0%, 100%, 0.6) 3px, hsl(0, 0%, 99%) 3px, hsl(0, 0%, 93%));
+  --fgTabTexture: linear-gradient(transparent 2px, hsla(0, 0%, 100%, .6) 2px, hsla(0, 0%, 100%, .6) 3px, hsl(0, 0%, 99%) 3px, hsl(0, 0%, 93%));
   --toolbarColorLWT: rgba(253, 253, 253, 0.45);
-  --fgTabTextureLWT: linear-gradient(transparent, transparent 2px, rgba(254, 254, 254, 0.72) 2px, var(--toolbarColorLWT));
+  --fgTabTextureLWT: linear-gradient(transparent 2px, rgba(254, 254, 254, .72) 2px, var(--toolbarColorLWT));
   --fgTabBackgroundColor: transparent;
 }
--- a/mail/themes/windows/mail/primaryToolbar.css
+++ b/mail/themes/windows/mail/primaryToolbar.css
@@ -142,18 +142,17 @@ menu:not(:-moz-lwtheme):-moz-window-inac
     color: inherit;
   }
 }
 
 .mail-toolbox,
 .contentTabToolbox {
   -moz-appearance: none;
   border-top: none;
-  background-image: linear-gradient(rgba(253, 253, 253, 0.45),
-                                    rgba(255, 255, 255, 0));
+  background-image: linear-gradient(var(--toolbarHighlight), transparent);
   box-shadow: 0 1px 0 rgba(253, 253, 253, 0.45) inset;
 }
 
 .mail-toolbox::after,
 .contentTabToolbox::after {
   content: "";
   display: -moz-box;
   height: 1px;
@@ -1740,18 +1739,18 @@ toolbar[mode="text"] .button-appmenu .to
 
   #mail-toolbox:not(:-moz-lwtheme),
   #navigation-toolbox:not(:-moz-lwtheme),
   .glodaTabToolbar {
     color: black;
   }
 
   #mail-toolbar-menubar2 {
-    background-image: linear-gradient(rgba(253, 253, 253, 0.45),
-                                      rgba(253, 253, 253, 0.45));
+    background-image: linear-gradient(var(--toolbarHighlight),
+                                      var(--toolbarHighlight));
     box-shadow: 0 1px 0 rgba(253, 253, 253, 0.45) inset;
     padding-bottom: 1px !important;
     padding-top: 2px;
   }
 
   #messengerWindow[tabsintitlebar][sizemode="normal"] #mail-toolbar-menubar2 {
     margin-top: 0;
   }
@@ -1913,16 +1912,21 @@ toolbar[mode="text"] .button-appmenu .to
 
 @media (-moz-os-version: windows-win8),
        (-moz-os-version: windows-win10) {
   #appmenuSecondaryPane {
     --appMenu-bg-color: -moz-dialog;
     --appMenu-bg-box-shadow: ThreeDShadow;
   }
 
+  .mail-toolbox,
+  .contentTabToolbox {
+    box-shadow: none;
+  }
+
   .mail-toolbox:not(:-moz-lwtheme),
   .contentTabToolbox:not(:-moz-lwtheme) {
     background-image: none;
   }
 
   #mail-toolbar-menubar2 {
     background-image: none;
     box-shadow: none;
--- a/mail/themes/windows/mail/tabmail.css
+++ b/mail/themes/windows/mail/tabmail.css
@@ -176,23 +176,27 @@ tabpanels {
 .tabs-closebutton,
 .tab-close-button {
   -moz-appearance: none;
   border: none;
 }
 
 /* Invert the unhovered close tab icons on bright-text tabs */
 @media not all and (min-resolution: 1.1dppx) {
+  .tab-close-button:-moz-lwtheme-brighttext,
+  .tabs-closebutton:-moz-lwtheme-brighttext,
   #tabs-toolbar[brighttext] .tabs-closebutton,
   #tabs-toolbar[brighttext] .tab-close-button:not([selected=true]) {
     list-style-image: url("chrome://global/skin/icons/close-inverted.png");
   }
 }
 
 @media (min-resolution: 1.1dppx) {
+  .tab-close-button:-moz-lwtheme-brighttext,
+  .tabs-closebutton:-moz-lwtheme-brighttext,
   #tabs-toolbar[brighttext] .tabs-closebutton,
   #tabs-toolbar[brighttext] .tab-close-button:not([selected=true]) {
     list-style-image: url("chrome://global/skin/icons/close-inverted@2x.png");
   }
 }
 
 @media (-moz-os-version: windows-xp) {
   .tabs-closebutton-box {
--- a/mail/themes/windows/mail/windowsShared.css
+++ b/mail/themes/windows/mail/windowsShared.css
@@ -1,15 +1,15 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 :root {
-  --toolbarHighlight: rgba(253, 253, 253, 0.45);
-  --fgTabTexture: linear-gradient(transparent, transparent 2px, rgba(254, 254, 254, 0.72) 2px, rgba(254, 254, 254, 0.72) 2px, rgba(250, 250, 250, 0.88) 3px, rgba(250, 250, 250, 0.88) 3px, rgba(254, 254,  254, 0.72) 4px, rgba(254, 254, 254, 0.72) 4px, var(--toolbarHighlight));
+  --toolbarHighlight: rgba(255, 255, 255, 0.4);
+  --fgTabTexture: linear-gradient(transparent, transparent 2px, var(--toolbarHighlight) 2px, var(--toolbarHighlight));
   --fgTabBackgroundColor: -moz-dialog;
   --fgTabTextureLWT: var(--fgTabTexture);
 
   /* Aero-only variables */
 
   --customToolbarColor: hsl(210, 75%, 92%);
 }