Bug 1703651 - Proton toolbar icons should have no fill opacity by default. r=harry,desktop-theme-reviewers

Differential Revision: https://phabricator.services.mozilla.com/D111176

browser/themes/linux/browser.css

@@ -21,7 +21,7 @@
 
   --toolbarbutton-border-radius: 4px;
   --toolbarbutton-vertical-text-padding: calc(var(--toolbarbutton-inner-padding) - 1px);
-  --toolbarbutton-icon-fill-opacity: .85;
+  --toolbarbutton-icon-fill-opacity: 1;
 
   --panel-separator-color: ThreeDShadow;
 
@@ -37,6 +37,10 @@
 } /*** END proton ***/
 
 @media not (-moz-proton) {
+:root {
+  --toolbarbutton-icon-fill-opacity: .85;
+}
+
 #tabbrowser-tabs {
   --tab-line-color: -moz-accent-color;
 }

browser/themes/osx/browser.css

@@ -14,7 +14,7 @@
 
   --toolbarbutton-vertical-text-padding: calc(var(--toolbarbutton-inner-padding) + 1px);
   --toolbarbutton-border-radius: 4px;
-  --toolbarbutton-icon-fill-opacity: .7;
+  --toolbarbutton-icon-fill-opacity: 1;
 
   --panel-separator-color: hsla(210,4%,10%,.14);
 
@@ -33,6 +33,10 @@
 }
 
 @media not (-moz-proton) {
+:root {
+  --toolbarbutton-icon-fill-opacity: .7;
+}
+
 #navigator-toolbox {
   appearance: none;
   --tabs-border-color: rgba(0,0,0,.2);

browser/themes/shared/identity-block/identity-block.inc.css

@@ -28,8 +28,14 @@
   /* Set default fill for icons in the identity block.
      Individual icons can override this. */
   fill: currentColor;
+}
+
+@media not (-moz-proton) {
+#identity-box,
+#tracking-protection-icon-container {
   fill-opacity: .6;
 }
+}
 
 @media not (-moz-proton-urlbar) {
 #identity-box[pageproxystate="invalid"] {
@@ -236,8 +242,13 @@
 
 #urlbar:not(.searchButton) > #urlbar-input-container > #identity-box[pageproxystate="invalid"] #identity-icon {
   list-style-image: url(chrome://global/skin/icons/search-glass.svg);
+}
+
+@media not (-moz-proton) {
+#urlbar:not(.searchButton) > #urlbar-input-container > #identity-box[pageproxystate="invalid"] #identity-icon {
   fill-opacity: .4;
 }
+}
 
 #urlbar[actiontype="extension"] > #urlbar-input-container > #identity-box #identity-icon {
   list-style-image: url(chrome://mozapps/skin/extensions/extension.svg);

browser/themes/windows/browser.css

@@ -42,14 +42,16 @@
     --toolbar-non-lwt-textcolor: #0c0c0d;
     --toolbar-non-lwt-bgimage: none;
 
-    --toolbarbutton-icon-fill-opacity: .7;
-
     --panel-separator-color: hsla(210,4%,10%,.14);
 
     --chrome-content-separator-color: #e1e1e2;
   }
 
   @media not (-moz-proton) {
+  :root {
+    --toolbarbutton-icon-fill-opacity: .7;
+  }
+
   #navigator-toolbox {
     --tabs-border-color: rgba(0,0,0,.3);
   }