Bug 1689761 - update toolbar focus outline color from currentColor to proton colors (theme dependent). r=jaws
☠☠ backed out by a65883accdf6 ☠ ☠
authorYura Zenevich <yura.zenevich@gmail.com>
Wed, 10 Feb 2021 15:21:05 +0000
changeset 566825 232a4e735cdcbdb6d16f05e3a9b79f8c69301a31
parent 566824 e63c5a6932e3eab13da954b379af0ee1c6a25b65
child 566826 8c53818717a1fb7a9925b8ac612d504167dabced
push id38191
push userbtara@mozilla.com
push dateThu, 11 Feb 2021 05:02:45 +0000
treeherdermozilla-central@5cbcb80f72bd [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjaws
bugs1689761
milestone87.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1689761 - update toolbar focus outline color from currentColor to proton colors (theme dependent). r=jaws Differential Revision: https://phabricator.services.mozilla.com/D103822
browser/themes/shared/toolbarbuttons.inc.css
--- a/browser/themes/shared/toolbarbuttons.inc.css
+++ b/browser/themes/shared/toolbarbuttons.inc.css
@@ -3,18 +3,16 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 :root {
   --toolbarbutton-hover-transition-duration: 150ms;
 
   --toolbarbutton-outer-padding: 2px;
   --toolbarbutton-inner-padding: 6px;
 
-  --toolbarbutton-focus-outline: 2px solid currentColor;
-
   /* These hover and active colors should work on both light and dark
      backgrounds. We'll later set colors that cater for light and dark
      backgrounds specifically when we can detect them. */
   --toolbarbutton-hover-background: var(--lwt-toolbarbutton-hover-background, hsla(0,0%,70%,.4));
   --toolbarbutton-active-background: var(--lwt-toolbarbutton-active-background, hsla(0,0%,70%,.6));
 
   --backbutton-background: hsla(0,100%,100%,.8);
   --backbutton-hover-background: var(--backbutton-background);
@@ -26,16 +24,28 @@
   --bookmark-block-padding: 4px;
 
   /* This default value of --toolbarbutton-height is defined to prevent
      CSS errors for an invalid variable. The value should not get used,
      as a more specific value should be set when the value will be used. */
   --toolbarbutton-height: 0;
 }
 
+@supports not -moz-bool-pref("browser.proton.enabled") {
+:root {
+  --toolbarbutton-focus-outline: 2px solid currentColor;
+}
+} /*** END !proton ***/
+
+@supports -moz-bool-pref("browser.proton.enabled") {
+:root {
+  --toolbarbutton-focus-outline: var(--focus-outline);
+}
+} /*** END !proton ***/
+
 :root[uidensity=compact] {
   --toolbarbutton-outer-padding: 1px;
   --bookmark-block-padding: 1px;
 }
 
 :root[uidensity=touch] {
   --toolbarbutton-inner-padding: 9px;
   --bookmark-block-padding: 7px;