Bug 1215093 - For lightweight themes, make toolbar buttons semitransparent white with a black border on :hover/:active. r=gijs, a=lizzard
authorDão Gottwald <dao@mozilla.com>
Fri, 16 Oct 2015 13:09:56 +0200
changeset 296549 51cfbff86756c46a28028bd26498a1363946b42b
parent 296548 6a63f9c56503375e3052ec8c181b7d8e2ac4c18f
child 296550 6219f59cbfbf1132597ae48499572e0434d5e355
push id5245
push userraliiev@mozilla.com
push dateThu, 29 Oct 2015 11:30:51 +0000
treeherdermozilla-beta@dac831dc1bd0 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersgijs, lizzard
bugs1215093
milestone43.0a2
Bug 1215093 - For lightweight themes, make toolbar buttons semitransparent white with a black border on :hover/:active. r=gijs, a=lizzard
browser/themes/windows/browser.css
--- a/browser/themes/windows/browser.css
+++ b/browser/themes/windows/browser.css
@@ -47,25 +47,35 @@
   --panel-separator-color: ThreeDLightShadow;
 
   --urlbar-separator-color: hsla(0,0%,16%,.2);
 }
 
 #nav-bar[brighttext] {
   --toolbarbutton-hover-background: rgba(255,255,255,.25);
   --toolbarbutton-hover-bordercolor: rgba(255,255,255,.5);
-  --toolbarbutton-hover-boxshadow: none;
 
   --toolbarbutton-active-background: rgba(255,255,255,.4);
   --toolbarbutton-active-bordercolor: rgba(255,255,255,.7);
   --toolbarbutton-active-boxshadow: 0 0 0 1px rgba(255,255,255,.4) inset;
 
   --toolbarbutton-checkedhover-backgroundcolor: rgba(255,255,255,.3);
 }
 
+#nav-bar:-moz-lwtheme {
+  --toolbarbutton-hover-bordercolor: rgba(0,0,0,.2);
+  --toolbarbutton-hover-background: rgba(255,255,255,.5);
+
+  --toolbarbutton-active-background: rgba(70%,70%,70%,.25);
+  --toolbarbutton-active-bordercolor: rgba(0,0,0,.3);
+  --toolbarbutton-active-boxshadow: 0 0 2px rgba(0,0,0,.6) inset;
+
+  --toolbarbutton-checkedhover-backgroundcolor: rgba(85%,85%,85%,.25);
+}
+
 #menubar-items {
   -moz-box-orient: vertical; /* for flex hack */
 }
 
 #main-menubar {
   -moz-box-flex: 1; /* make menu items expand to fill toolbar height */
 }
 
@@ -1122,20 +1132,16 @@ toolbarbutton[constrain-size="true"][cui
 /* ::::: Location Bar ::::: */
 
 #nav-bar {
   --urlbar-border-color: ThreeDShadow;
   --urlbar-border-color-hover: var(--urlbar-border-color);
 }
 
 #nav-bar:-moz-lwtheme {
-  --urlbar-border-color: rgba(0,0,0,.32);
-}
-
-#nav-bar:-moz-lwtheme-brighttext {
   --urlbar-border-color: var(--toolbarbutton-hover-bordercolor);
 }
 
 @media (-moz-windows-default-theme) {
   @media (-moz-os-version: windows-vista),
          (-moz-os-version: windows-win7),
          (-moz-os-version: windows-win8) {
     #nav-bar:not(:-moz-lwtheme) {
@@ -1157,21 +1163,16 @@ toolbarbutton[constrain-size="true"][cui
   -moz-appearance: none;
   margin: 0 3px;
   padding: 0;
   background-clip: padding-box;
   border: 1px solid;
   border-color: var(--urlbar-border-color);
 }
 
-#urlbar:-moz-lwtheme-brighttext,
-.searchbar-textbox:-moz-lwtheme-brighttext {
-  background-clip: border-box;
-}
-
 #urlbar:hover,
 .searchbar-textbox:hover {
   border-color: var(--urlbar-border-color-hover);
 }
 
 /* overlap the urlbar's border */
 #PopupAutoCompleteRichResult {
   margin-top: -1px;