Skip to content

Commit aaac164

Browse files
committed
fix: built-in theme selector #1148
1 parent db5589e commit aaac164

8 files changed

Lines changed: 537 additions & 231 deletions

File tree

css/leptonChrome.css

Lines changed: 348 additions & 142 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

css/leptonChromeESR.css

Lines changed: 174 additions & 71 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/tab/selected_tab/_bottom_rounded_corner.scss

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -94,8 +94,7 @@
9494
}
9595
}
9696

97-
&::is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"])#{$lwtheme}
98-
#TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected] .tab-background {
97+
&#{$builtInDarkStyle} #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected] .tab-background {
9998
&::before,
10099
&::after {
101100
/* As Selected Tab - Box Shadow */

src/tab/selected_tab/_box_shadow.scss

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ $ucTabBackgroundShadowHard: drop-shadow(-1px 0px 0px var(--uc-tab-shadow-color,
1717
filter: $ucTabBasicShadow;
1818
}
1919

20-
:root:is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"])#{$lwtheme}
20+
:root#{$builtInDarkStyle}
2121
#TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab {
2222
&:is([selected], [multiselected]) {
2323
> .tab-stack
@@ -37,7 +37,7 @@ $ucTabBackgroundShadowHard: drop-shadow(-1px 0px 0px var(--uc-tab-shadow-color,
3737

3838
/* For themes outside of Light and Dark (which are curated by Mozilla), show a thicker border
3939
around the tab to help themes that are dependent on tab_line to show the selected tab. */
40-
:root:not([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"])#{$lwtheme}
40+
:root:not(#{$builtInLightStyle})
4141
#TabsToolbar:not([brighttext])
4242
#tabbrowser-tabs:not([noshadowfortests])
4343
.tabbrowser-tab:is([visuallyselected], [multiselected])
@@ -48,7 +48,7 @@ $ucTabBackgroundShadowHard: drop-shadow(-1px 0px 0px var(--uc-tab-shadow-color,
4848
$ucTabAdditionalShadow;
4949
}
5050

51-
:root:not([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"])#{$lwtheme}
51+
:root:not(#{$builtInDarkStyle})
5252
#TabsToolbar[brighttext]
5353
#tabbrowser-tabs:not([noshadowfortests])
5454
.tabbrowser-tab:is([visuallyselected], [multiselected])

src/theme/_fully_color.scss

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -100,10 +100,8 @@ html#main-window menupopup:not(.in-menulist) {
100100
}
101101

102102
/* Default theme color preservation */
103-
:root[lwtheme-mozlightdark] menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]), /* Legacy */
104-
:root[lwtheme-mozlightdark] menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup), /* Legacy */
105-
:root:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]),
106-
:root:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) {
103+
#{built-in-default-theme()} menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]),
104+
#{built-in-default-theme()} menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) {
107105
--menu-color: var(--toolbar-color, var(--in-content-page-color)) !important;
108106
--arrowpanel-background: var(
109107
--toolbar-bgcolor,

src/theme/system_default_theme/_mac.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -247,7 +247,7 @@
247247
> .tabbrowser-tab
248248
> .tab-stack
249249
> .tab-background[selected],
250-
:root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][lwt-default-theme-in-dark-mode]
250+
:root#{$builtInDarkStyle}
251251
#tabbrowser-tabs:not([movingtab])
252252
> #pinned-tabs-container
253253
> .tabbrowser-tab
@@ -259,7 +259,7 @@
259259
> .tabbrowser-tab
260260
> .tab-stack
261261
> .tab-background[selected],
262-
:root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][lwt-default-theme-in-dark-mode]
262+
:root#{$builtInDarkStyle}
263263
#tabbrowser-tabs:not([movingtab])
264264
> #tabbrowser-arrowscrollbox
265265
> .tabbrowser-tab

src/theme/system_default_theme/_win10.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -354,7 +354,7 @@
354354
> .tabbrowser-tab
355355
> .tab-stack
356356
> .tab-background[multiselected]:not([selected]),
357-
:root:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"])
357+
#{built-in-default-theme()}
358358
#tabbrowser-tabs:not([movingtab])
359359
> #pinned-tabs-container
360360
> .tabbrowser-tab
@@ -372,7 +372,7 @@
372372
> .tabbrowser-tab
373373
> .tab-stack
374374
> .tab-background[multiselected]:not([selected]),
375-
:root:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"])
375+
#{built-in-default-theme()}
376376
#tabbrowser-tabs:not([movingtab])
377377
> #tabbrowser-arrowscrollbox
378378
> .tabbrowser-tab

src/utils/_theme.scss

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,13 @@ $_lightText: '[lwthemetextcolor="bright"]';
99
$_darkText: ":not(#{$_lightText})";
1010

1111
$_sysDark: "[lwt-default-theme-in-dark-mode]";
12-
$_lightStyle: '[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"]';
13-
$_darkStyle: '[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]';
12+
$builtInLightStyle: ':is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [builtintheme][devtoolstheme="light"])';
13+
$builtInDarkStyle: ':is([style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], [builtintheme][devtoolstheme="dark"])';
1414

1515
//== Mixin =====================================================================
1616
@function built-in-default-theme() {
1717
$oldDefault: selector.append(":root", $_lightdark);
18-
$newDefault: selector.append(":root", ":is(#{$_lightStyle}, #{$_darkStyle})");
18+
$newDefault: selector.append(":root", ":is(#{$builtInLightStyle}, #{$builtInDarkStyle})");
1919

2020
@return "#{$oldDefault}, #{$newDefault}";
2121
}
@@ -29,14 +29,14 @@ $_darkStyle: '[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rg
2929

3030
@function built-in-light-theme() {
3131
$oldLight: selector.append(":root", $_lightdark, $_darkText);
32-
$newLight: selector.append(":root", $_lightStyle);
32+
$newLight: selector.append(":root", $builtInLightStyle);
3333

3434
@return "#{$oldLight}, #{$newLight}";
3535
}
3636

3737
@function built-in-dark-theme() {
3838
$oldDark: selector.append(":root", $_lightdark, $_lightText);
39-
$newDark: selector.append(":root", $_darkStyle);
39+
$newDark: selector.append(":root", $builtInDarkStyle);
4040

4141
@return "#{$oldDark}, #{$newDark}";
4242
}

0 commit comments

Comments
 (0)