tor-browser

commit 9d855dda3c90039ebb65efcd9c14d90aa1675266
parent feaf6919f740c88f26d085f75b84fc944b23ecbd
Author: Emilio Cobos Álvarez <emilio@crisal.io>
Date:   Mon, 13 Oct 2025 14:12:42 +0000

Bug 1993545 - Don't apply windows mica titlebar or accent color in tabs effects to built-in themes. r=desktop-theme-reviewers,dao

Turns out we need to introduce this differentiation between built-in
light/dark and non-native system theme because Windows system like
things are not behind the (-moz-native-theme) flag...

Might be worth trying to find a better design for this but for now this
would do. This also fixes the toolbox colors if you have the titlebar
checkbox checked, actually...

Also, prevent the non-native colors from being used for built-in themes
if you have prefers-contrast but not forced-colors and non-native theme
(applicable to macOS), I don't think that's intended and that would
introduce yet another need to distinguish these (but in a media query
which gets a bit more unwieldy).

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

Diffstat:
M
browser/themes/shared/browser-colors.css
 | 
17
+++++++----------
M
browser/themes/windows/browser.css
 | 
10
+++++++++-
M
toolkit/modules/LightweightThemeConsumer.sys.mjs
 | 
1
+

3 files changed, 17 insertions(+), 11 deletions(-)
diff --git a/browser/themes/shared/browser-colors.css b/browser/themes/shared/browser-colors.css
@@ -79,7 +79,7 @@
  * theme enabled, instead choosing to fall back to system colors and
  * transparencies in order to look more native.
  */
-@media not ((prefers-contrast) or (-moz-native-theme)) {
+@media not ((forced-colors) or (-moz-native-theme)) {
   :root:not([lwtheme]) {
     --color-accent-primary: light-dark(rgb(0, 97, 224), rgb(0, 221, 255));
     --button-text-color-primary: light-dark(rgb(251, 251, 254), rgb(43, 42, 51));
@@ -102,15 +102,12 @@
     --tab-selected-textcolor: light-dark(rgb(21, 20, 26), rgb(255, 255, 255));
     --tabs-navbar-separator-style: none;
 
-    /* stylelint-disable-next-line media-query-no-invalid */
-    @media not ((-moz-windows-mica) or ((-moz-windows-accent-color-in-titlebar) and -moz-pref("browser.theme.windows.accent-color-in-tabs.enabled"))) {
-      --toolbox-bgcolor: light-dark(rgb(234, 234, 237), rgb(28, 27, 34));
-      --toolbox-textcolor: light-dark(rgb(21, 20, 26), rgb(251, 251, 254));
-      --toolbox-bgcolor-inactive: var(--toolbox-bgcolor);
-      --toolbox-textcolor-inactive: var(--toolbox-textcolor);
-      &:where([customtitlebar]) {
-        --toolbox-bgcolor-inactive: light-dark(rgb(235, 235, 239), rgb(31, 30, 37));
-      }
+    --toolbox-bgcolor: light-dark(rgb(234, 234, 237), rgb(28, 27, 34));
+    --toolbox-textcolor: light-dark(rgb(21, 20, 26), rgb(251, 251, 254));
+    --toolbox-bgcolor-inactive: var(--toolbox-bgcolor);
+    --toolbox-textcolor-inactive: var(--toolbox-textcolor);
+    &:where([customtitlebar]) {
+      --toolbox-bgcolor-inactive: light-dark(rgb(235, 235, 239), rgb(31, 30, 37));
     }
 
     --toolbar-color: light-dark(rgb(21, 20, 26), rgb(251, 251, 254));
diff --git a/browser/themes/windows/browser.css b/browser/themes/windows/browser.css
@@ -25,7 +25,15 @@
   }
 }
 
-:root[customtitlebar]:not([lwtheme]) {
+:root[customtitlebar]:not([lwtheme], [builtintheme]) {
+  /* stylelint-disable-next-line media-query-no-invalid */
+  @media (-moz-windows-mica) or ((-moz-windows-accent-color-in-titlebar) and -moz-pref("browser.theme.windows.accent-color-in-tabs.enabled")) {
+    --toolbox-bgcolor: ActiveCaption;
+    --toolbox-textcolor: CaptionText;
+    --toolbox-bgcolor-inactive: InactiveCaption;
+    --toolbox-textcolor-inactive: InactiveCaptionText;
+  }
+
   @media (-moz-windows-mica) {
     background-color: transparent;
     /* stylelint-disable-next-line media-query-no-invalid */
diff --git a/toolkit/modules/LightweightThemeConsumer.sys.mjs b/toolkit/modules/LightweightThemeConsumer.sys.mjs
@@ -390,6 +390,7 @@ LightweightThemeConsumer.prototype = {
       );
     }
     root.toggleAttribute("lwtheme", hasTheme);
+    root.toggleAttribute("builtintheme", !!builtinThemeConfig);
 
     let contentThemeData = _getContentProperties(this._doc, hasTheme, theme);
     Services.ppmm.sharedData.set(`theme/${this._winId}`, contentThemeData);