From db5589e70364fc5216553dfcebb31ffd5890ff9d Mon Sep 17 00:00:00 2001 From: hdk5 Date: Sat, 13 Dec 2025 13:00:32 +0200 Subject: [PATCH 01/12] Fix context menu icon padding (#1147) --- css/leptonChrome.css | 264 ++++++++++++++++++++++++++++++++++-- css/leptonChromeESR.css | 132 +++++++++++++++++- src/icons/layout/_menu.scss | 10 +- 3 files changed, 383 insertions(+), 23 deletions(-) diff --git a/css/leptonChrome.css b/css/leptonChrome.css index 2fbb895..9f43e8f 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -12471,12 +12471,72 @@ padding-inline-start: var(--menu-background-padding-default) !important; margin-left: 0 !important; } + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup:not(.in-menulist) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup:not(.in-menulist) + > menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #menu_FilePopup, + #menu_EditPopup, + #menu_viewPopup, + #goPopup, + #historyMenuPopup, + #bookmarksMenuPopup, + #menu_ProfilesPopup, + #menu_ToolsPopup, + #windowPopup, + #menu_HelpPopup, + #usercssloader-menupopup, + #sidebar-context-menu + ) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #menu_FilePopup, + #menu_EditPopup, + #menu_viewPopup, + #goPopup, + #historyMenuPopup, + #bookmarksMenuPopup, + #menu_ProfilesPopup, + #menu_ToolsPopup, + #windowPopup, + #menu_HelpPopup, + #usercssloader-menupopup, + #sidebar-context-menu + ) + menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) + > menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #context_sendTabToDevicePopupMenu, + #context-sendpagetodevice-popup, + #context-sendlinktodevice-popup, + #frame > menupopup, + #spell-dictionaries-menu, + #context-ask-chat > menupopup + ) + > menuitem:not([type="checkbox"][checked="true"], [type="radio"]) + > .menu-icon, + .openintabs-menuitem > .menu-icon, + #blockedPopupDontShowMessage > .menu-icon, + #BMB_viewBookmarksToolbar > .menu-icon, + #sidebarMenu-popup:is(menupopup) > .menu-icon, + #context_openANewTab.tabmix-newtab-menu-icon > .menu-icon { + display: none !important; + } .menupopup-arrowscrollbox { padding-inline: 0 !important; /* Original: padding: var(--panel-padding); --panel-padding-block: 4px; */ } - menupopup[needsgutter] > :is(menu, menuitem) > .menu-icon { - display: none !important; - } } @media (-moz-platform: windows), (-moz-gtk-csd-available) { @media -moz-pref("userChrome.theme.non_native_menu") { @@ -12548,12 +12608,72 @@ padding-inline-start: var(--menu-background-padding-default) !important; margin-left: 0 !important; } + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup:not(.in-menulist) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup:not(.in-menulist) + > menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #menu_FilePopup, + #menu_EditPopup, + #menu_viewPopup, + #goPopup, + #historyMenuPopup, + #bookmarksMenuPopup, + #menu_ProfilesPopup, + #menu_ToolsPopup, + #windowPopup, + #menu_HelpPopup, + #usercssloader-menupopup, + #sidebar-context-menu + ) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #menu_FilePopup, + #menu_EditPopup, + #menu_viewPopup, + #goPopup, + #historyMenuPopup, + #bookmarksMenuPopup, + #menu_ProfilesPopup, + #menu_ToolsPopup, + #windowPopup, + #menu_HelpPopup, + #usercssloader-menupopup, + #sidebar-context-menu + ) + menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) + > menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #context_sendTabToDevicePopupMenu, + #context-sendpagetodevice-popup, + #context-sendlinktodevice-popup, + #frame > menupopup, + #spell-dictionaries-menu, + #context-ask-chat > menupopup + ) + > menuitem:not([type="checkbox"][checked="true"], [type="radio"]) + > .menu-icon, + .openintabs-menuitem > .menu-icon, + #blockedPopupDontShowMessage > .menu-icon, + #BMB_viewBookmarksToolbar > .menu-icon, + #sidebarMenu-popup:is(menupopup) > .menu-icon, + #context_openANewTab.tabmix-newtab-menu-icon > .menu-icon { + display: none !important; + } .menupopup-arrowscrollbox { padding-inline: 0 !important; /* Original: padding: var(--panel-padding); --panel-padding-block: 4px; */ } - menupopup[needsgutter] > :is(menu, menuitem) > .menu-icon { - display: none !important; - } } } } @@ -28260,12 +28380,72 @@ padding-inline-start: var(--menu-background-padding-default) !important; margin-left: 0 !important; } + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup:not(.in-menulist) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup:not(.in-menulist) + > menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #menu_FilePopup, + #menu_EditPopup, + #menu_viewPopup, + #goPopup, + #historyMenuPopup, + #bookmarksMenuPopup, + #menu_ProfilesPopup, + #menu_ToolsPopup, + #windowPopup, + #menu_HelpPopup, + #usercssloader-menupopup, + #sidebar-context-menu + ) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #menu_FilePopup, + #menu_EditPopup, + #menu_viewPopup, + #goPopup, + #historyMenuPopup, + #bookmarksMenuPopup, + #menu_ProfilesPopup, + #menu_ToolsPopup, + #windowPopup, + #menu_HelpPopup, + #usercssloader-menupopup, + #sidebar-context-menu + ) + menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) + > menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #context_sendTabToDevicePopupMenu, + #context-sendpagetodevice-popup, + #context-sendlinktodevice-popup, + #frame > menupopup, + #spell-dictionaries-menu, + #context-ask-chat > menupopup + ) + > menuitem:not([type="checkbox"][checked="true"], [type="radio"]) + > .menu-icon, + .openintabs-menuitem > .menu-icon, + #blockedPopupDontShowMessage > .menu-icon, + #BMB_viewBookmarksToolbar > .menu-icon, + #sidebarMenu-popup:is(menupopup) > .menu-icon, + #context_openANewTab.tabmix-newtab-menu-icon > .menu-icon { + display: none !important; + } .menupopup-arrowscrollbox { padding-inline: 0 !important; /* Original: padding: var(--panel-padding); --panel-padding-block: 4px; */ } - menupopup[needsgutter] > :is(menu, menuitem) > .menu-icon { - display: none !important; - } } @media (not (-moz-bool-pref: "userChrome.icon.disabled")) and (-moz-bool-pref: "userChrome.icon.menu") and (-moz-platform: windows) and (-moz-bool-pref: "userChrome.theme.non_native_menu") and (-moz-gtk-csd-available), (not (-moz-bool-pref: "userChrome.icon.disabled")) and (-moz-bool-pref: "userChrome.icon.menu") and (-moz-gtk-csd-available) and (-moz-bool-pref: "userChrome.theme.non_native_menu") and (-moz-gtk-csd-available) { @@ -28332,12 +28512,72 @@ padding-inline-start: var(--menu-background-padding-default) !important; margin-left: 0 !important; } + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup:not(.in-menulist) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup:not(.in-menulist) + > menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #menu_FilePopup, + #menu_EditPopup, + #menu_viewPopup, + #goPopup, + #historyMenuPopup, + #bookmarksMenuPopup, + #menu_ProfilesPopup, + #menu_ToolsPopup, + #windowPopup, + #menu_HelpPopup, + #usercssloader-menupopup, + #sidebar-context-menu + ) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #menu_FilePopup, + #menu_EditPopup, + #menu_viewPopup, + #goPopup, + #historyMenuPopup, + #bookmarksMenuPopup, + #menu_ProfilesPopup, + #menu_ToolsPopup, + #windowPopup, + #menu_HelpPopup, + #usercssloader-menupopup, + #sidebar-context-menu + ) + menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) + > menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #context_sendTabToDevicePopupMenu, + #context-sendpagetodevice-popup, + #context-sendlinktodevice-popup, + #frame > menupopup, + #spell-dictionaries-menu, + #context-ask-chat > menupopup + ) + > menuitem:not([type="checkbox"][checked="true"], [type="radio"]) + > .menu-icon, + .openintabs-menuitem > .menu-icon, + #blockedPopupDontShowMessage > .menu-icon, + #BMB_viewBookmarksToolbar > .menu-icon, + #sidebarMenu-popup:is(menupopup) > .menu-icon, + #context_openANewTab.tabmix-newtab-menu-icon > .menu-icon { + display: none !important; + } .menupopup-arrowscrollbox { padding-inline: 0 !important; /* Original: padding: var(--panel-padding); --panel-padding-block: 4px; */ } - menupopup[needsgutter] > :is(menu, menuitem) > .menu-icon { - display: none !important; - } } @media (not (-moz-bool-pref: "userChrome.icon.disabled")) and (-moz-bool-pref: "userChrome.icon.menu") and (-moz-platform: windows) { :root { diff --git a/css/leptonChromeESR.css b/css/leptonChromeESR.css index bba6411..1b477d1 100644 --- a/css/leptonChromeESR.css +++ b/css/leptonChromeESR.css @@ -12960,12 +12960,72 @@ padding-inline-start: var(--menu-background-padding-default) !important; margin-left: 0 !important; } + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup:not(.in-menulist) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup:not(.in-menulist) + > menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #menu_FilePopup, + #menu_EditPopup, + #menu_viewPopup, + #goPopup, + #historyMenuPopup, + #bookmarksMenuPopup, + #menu_ProfilesPopup, + #menu_ToolsPopup, + #windowPopup, + #menu_HelpPopup, + #usercssloader-menupopup, + #sidebar-context-menu + ) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #menu_FilePopup, + #menu_EditPopup, + #menu_viewPopup, + #goPopup, + #historyMenuPopup, + #bookmarksMenuPopup, + #menu_ProfilesPopup, + #menu_ToolsPopup, + #windowPopup, + #menu_HelpPopup, + #usercssloader-menupopup, + #sidebar-context-menu + ) + menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) + > menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #context_sendTabToDevicePopupMenu, + #context-sendpagetodevice-popup, + #context-sendlinktodevice-popup, + #frame > menupopup, + #spell-dictionaries-menu, + #context-ask-chat > menupopup + ) + > menuitem:not([type="checkbox"][checked="true"], [type="radio"]) + > .menu-icon, + .openintabs-menuitem > .menu-icon, + #blockedPopupDontShowMessage > .menu-icon, + #BMB_viewBookmarksToolbar > .menu-icon, + #sidebarMenu-popup:is(menupopup) > .menu-icon, + #context_openANewTab.tabmix-newtab-menu-icon > .menu-icon { + display: none !important; + } .menupopup-arrowscrollbox { padding-inline: 0 !important; /* Original: padding: var(--panel-padding); --panel-padding-block: 4px; */ } - menupopup[needsgutter] > :is(menu, menuitem) > .menu-icon { - display: none !important; - } } @media (-moz-os-version: windows-win7), (-moz-os-version: windows-win8), @@ -13044,12 +13104,72 @@ padding-inline-start: var(--menu-background-padding-default) !important; margin-left: 0 !important; } + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup:not(.in-menulist) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup:not(.in-menulist) + > menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #menu_FilePopup, + #menu_EditPopup, + #menu_viewPopup, + #goPopup, + #historyMenuPopup, + #bookmarksMenuPopup, + #menu_ProfilesPopup, + #menu_ToolsPopup, + #windowPopup, + #menu_HelpPopup, + #usercssloader-menupopup, + #sidebar-context-menu + ) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #menu_FilePopup, + #menu_EditPopup, + #menu_viewPopup, + #goPopup, + #historyMenuPopup, + #bookmarksMenuPopup, + #menu_ProfilesPopup, + #menu_ToolsPopup, + #windowPopup, + #menu_HelpPopup, + #usercssloader-menupopup, + #sidebar-context-menu + ) + menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) + > menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-icon, + menupopup:is( + #context_sendTabToDevicePopupMenu, + #context-sendpagetodevice-popup, + #context-sendlinktodevice-popup, + #frame > menupopup, + #spell-dictionaries-menu, + #context-ask-chat > menupopup + ) + > menuitem:not([type="checkbox"][checked="true"], [type="radio"]) + > .menu-icon, + .openintabs-menuitem > .menu-icon, + #blockedPopupDontShowMessage > .menu-icon, + #BMB_viewBookmarksToolbar > .menu-icon, + #sidebarMenu-popup:is(menupopup) > .menu-icon, + #context_openANewTab.tabmix-newtab-menu-icon > .menu-icon { + display: none !important; + } .menupopup-arrowscrollbox { padding-inline: 0 !important; /* Original: padding: var(--panel-padding); --panel-padding-block: 4px; */ } - menupopup[needsgutter] > :is(menu, menuitem) > .menu-icon { - display: none !important; - } } } } diff --git a/src/icons/layout/_menu.scss b/src/icons/layout/_menu.scss index 1807962..8dd626c 100644 --- a/src/icons/layout/_menu.scss +++ b/src/icons/layout/_menu.scss @@ -102,17 +102,17 @@ $_layoutCommonMenus: ( @include _layout_root_non_native; @include _layoutIconMenus { @include _layout_init_non_native(); + + // FF v141 #1128 + > .menu-icon { + display: none !important; + } } // FF v121 .menupopup-arrowscrollbox { padding-inline: 0 !important; /* Original: padding: var(--panel-padding); --panel-padding-block: 4px; */ } - - // FF v141 #1128 - menupopup[needsgutter] > :is(menu, menuitem) > .menu-icon { - display: none !important; - } } } From aaac164e9068caba9c5d281e81a519b04a23df19 Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Sun, 14 Dec 2025 02:51:30 +0900 Subject: [PATCH 02/12] fix: built-in theme selector #1148 --- css/leptonChrome.css | 490 +++++++++++++----- css/leptonChromeESR.css | 245 ++++++--- .../selected_tab/_bottom_rounded_corner.scss | 3 +- src/tab/selected_tab/_box_shadow.scss | 6 +- src/theme/_fully_color.scss | 6 +- src/theme/system_default_theme/_mac.scss | 4 +- src/theme/system_default_theme/_win10.scss | 4 +- src/utils/_theme.scss | 10 +- 8 files changed, 537 insertions(+), 231 deletions(-) diff --git a/css/leptonChrome.css b/css/leptonChrome.css index 9f43e8f..1db0abb 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -5,24 +5,38 @@ @media -moz-pref("userChrome.theme.built_in_contrast") { /*= Lightmode - Color darker =================================================*/ :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]), - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] { + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) { --lwt-accent-color: rgb(229, 229, 235) !important; /* Original: rgb(240, 240, 244) */ } @media (-moz-platform: windows) { :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] #navigator-toolbox { + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + #navigator-toolbox { background-color: var(--lwt-accent-color) !important; } } @media -moz-pref("layout.css.osx-font-smoothing.enabled") { :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] #navigator-toolbox { + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + #navigator-toolbox { background-color: var(--lwt-accent-color) !important; } } /*= Darkmode - Color lighter =================================================*/ :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) { --toolbar-bgcolor: rgba(43, 42, 51, 5) !important; /* Original: rgba(43, 42, 51, 1) */ } } @@ -765,9 +779,16 @@ > .tabbrowser-tab > .tab-stack > .tab-background[multiselected]:not([selected]), + :root[lwtheme-mozlightdark], :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);"] + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ), + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) ) #tabbrowser-tabs:not([movingtab]) > #pinned-tabs-container @@ -786,9 +807,16 @@ > .tabbrowser-tab > .tab-stack > .tab-background[multiselected]:not([selected]), + :root[lwtheme-mozlightdark], :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);"] + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ), + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) ) #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox @@ -1099,7 +1127,10 @@ > .tabbrowser-tab > .tab-stack > .tab-background[selected], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][lwt-default-theme-in-dark-mode] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #tabbrowser-tabs:not([movingtab]) > #pinned-tabs-container > .tabbrowser-tab @@ -1111,7 +1142,10 @@ > .tabbrowser-tab > .tab-stack > .tab-background[selected], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][lwt-default-theme-in-dark-mode] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab @@ -1747,7 +1781,10 @@ --in-content-link-color-visited: var(--blue-40) !important; } :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) { --button-primary-color: var(--in-content-page-color) !important; --button-primary-bgcolor: var(--blue-60) !important; --button-primary-hover-bgcolor: var(--blue-50) !important; @@ -1760,7 +1797,11 @@ } @media -moz-pref("userChrome.decoration.download_panel") { :root[lwtheme-mozlightdark][lwthemetextcolor="bright"] #downloadsListBox, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] #downloadsListBox { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) + #downloadsListBox { --button-primary-bgcolor: var(--blue-30); --button-primary-hover-bgcolor: var(--blue-20); } @@ -1771,9 +1812,15 @@ @media -moz-pref("userChrome.theme.private") { :root[privatebrowsingmode="temporary"], :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"])[privatebrowsingmode="temporary"], - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"], + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"], :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] { --lwt-additional-images: none !important; --lwt-header-image: none !important; --lwt-tab-text: rgba(232, 224, 255) !important; @@ -1807,17 +1854,17 @@ [lwtheme] ) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"]:is( - :-moz-lwtheme, - [lwtheme] - ) + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"]:is( - :-moz-lwtheme, - [lwtheme] - ) + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox { --lwt-tabs-border-color: var(--focus-outline-color) !important; } @@ -1829,12 +1876,15 @@ [lwtheme] ) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"] #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"][lwtheme-image]:is( - :-moz-lwtheme, - [lwtheme] - ) + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"][lwtheme-image]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"] #navigator-toolbox, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"][lwtheme-image]:is( @@ -1842,42 +1892,63 @@ [lwtheme] ) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"][lwtheme-image]:is( - :-moz-lwtheme, - [lwtheme] - ) + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"][lwtheme-image]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox { background-color: var(--lwt-accent-color) !important; } :root[privatebrowsingmode="temporary"] #TabsToolbar, :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"])[privatebrowsingmode="temporary"] #TabsToolbar, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"] #TabsToolbar, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"] #TabsToolbar, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] #TabsToolbar { --lwt-tab-line-color: var(--focus-outline-color) !important; } :root[privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"], :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"])[privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"], - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"], :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"] { --message-bar-text-color: var(--lwt-tab-text) !important; --in-content-page-color: var(--lwt-tab-text) !important; } :root[privatebrowsingmode="temporary"] menupopup, :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"])[privatebrowsingmode="temporary"] menupopup, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"] menupopup, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"] menupopup, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] menupopup { --menuitem-hover-background-color: #413d54 !important; --menu-background-color: #1d1935 !important; @@ -2025,16 +2096,28 @@ */ } /* Default theme color preservation */ - :root[lwtheme-mozlightdark] menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]), - :root[lwtheme-mozlightdark] menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup), + :root[lwtheme-mozlightdark], :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);"] + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ), + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) ) menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]), + :root[lwtheme-mozlightdark], :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);"] + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ), + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) ) menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) { --menu-color: var(--toolbar-color, var(--in-content-page-color)) !important; @@ -7233,9 +7316,9 @@ filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); } :root:is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([selected], [multiselected]) @@ -7244,16 +7327,16 @@ filter: drop-shadow(0 0 1px var(--uc-tab-shadow-color, transparent)); } :root:is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected]:not(:focus), :root:is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[multiselected]:not([visuallyselected]) { @@ -7262,9 +7345,11 @@ /* For themes outside of Light and Dark (which are curated by Mozilla), show a thicker border around the tab to help themes that are dependent on tab_line to show the selected tab. */ :root:not( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] - ):is(:-moz-lwtheme, [lwtheme]) + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + ) #TabsToolbar:not([brighttext]) #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected], [multiselected]) @@ -7275,9 +7360,11 @@ drop-shadow(1px -1px 0px var(--uc-tab-shadow-color, transparent)) drop-shadow(0 0 2px rgba(128, 128, 142, 0.5)); } :root:not( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected], [multiselected]) @@ -7384,18 +7471,18 @@ opacity: 0.3; } } - :root:not([customizing="true"])::is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + :root:not([customizing="true"]):is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected] .tab-background::before, - :root:not([customizing="true"])::is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + :root:not([customizing="true"]):is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected] @@ -7666,9 +7753,17 @@ border-radius: var(--tab-border-radius, 4px) var(--tab-border-radius, 4px) 0 0 !important; } :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]), - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] .tab-context-line, + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + .tab-context-line, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] .tab-context-line { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) + .tab-context-line { --tab-line-color: rgb(10, 132, 255); } .tabbrowser-tab:is([selected], [multiselected]) .tab-context-line { @@ -7756,9 +7851,17 @@ } /* selected tab style */ :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]), - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] .tab-context-line, + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + .tab-context-line, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] .tab-context-line { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) + .tab-context-line { --tab-line-color: #45a1ff; } .tabbrowser-tab:is([selected], [multiselected]) .tab-context-line::before { @@ -14482,26 +14585,40 @@ @media (-moz-bool-pref: "userChrome.theme.built_in_contrast") { /*= Lightmode - Color darker =================================================*/ :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]), - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] { + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) { --lwt-accent-color: rgb(229, 229, 235) !important; /* Original: rgb(240, 240, 244) */ } /*= Darkmode - Color lighter =================================================*/ } @media (-moz-bool-pref: "userChrome.theme.built_in_contrast") and (-moz-platform: windows) { :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] #navigator-toolbox { + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + #navigator-toolbox { background-color: var(--lwt-accent-color) !important; } } @media (-moz-bool-pref: "userChrome.theme.built_in_contrast") and (-moz-bool-pref: "layout.css.osx-font-smoothing.enabled") { :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] #navigator-toolbox { + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + #navigator-toolbox { background-color: var(--lwt-accent-color) !important; } } @media (-moz-bool-pref: "userChrome.theme.built_in_contrast") { :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) { --toolbar-bgcolor: rgba(43, 42, 51, 5) !important; /* Original: rgba(43, 42, 51, 1) */ } } @@ -15271,9 +15388,16 @@ > .tabbrowser-tab > .tab-stack > .tab-background[multiselected]:not([selected]), + :root[lwtheme-mozlightdark], :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);"] + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ), + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) ) #tabbrowser-tabs:not([movingtab]) > #pinned-tabs-container @@ -15292,9 +15416,16 @@ > .tabbrowser-tab > .tab-stack > .tab-background[multiselected]:not([selected]), + :root[lwtheme-mozlightdark], :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);"] + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ), + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) ) #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox @@ -15617,7 +15748,10 @@ > .tabbrowser-tab > .tab-stack > .tab-background[selected], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][lwt-default-theme-in-dark-mode] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #tabbrowser-tabs:not([movingtab]) > #pinned-tabs-container > .tabbrowser-tab @@ -15629,7 +15763,10 @@ > .tabbrowser-tab > .tab-stack > .tab-background[selected], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][lwt-default-theme-in-dark-mode] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab @@ -16261,7 +16398,10 @@ --in-content-link-color-visited: var(--blue-40) !important; } :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) { --button-primary-color: var(--in-content-page-color) !important; --button-primary-bgcolor: var(--blue-60) !important; --button-primary-hover-bgcolor: var(--blue-50) !important; @@ -16275,7 +16415,11 @@ } @media (-moz-bool-pref: "userChrome.theme.proton_color") and (-moz-bool-pref: "userChrome.theme.proton_color.dark_blue_accent") and (prefers-color-scheme: dark) and (-moz-bool-pref: "userChrome.decoration.download_panel") { :root[lwtheme-mozlightdark][lwthemetextcolor="bright"] #downloadsListBox, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] #downloadsListBox { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) + #downloadsListBox { --button-primary-bgcolor: var(--blue-30); --button-primary-hover-bgcolor: var(--blue-20); } @@ -16283,9 +16427,15 @@ @media (-moz-bool-pref: "userChrome.theme.private") { :root[privatebrowsingmode="temporary"], :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"])[privatebrowsingmode="temporary"], - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"], + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"], :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] { --lwt-additional-images: none !important; --lwt-header-image: none !important; --lwt-tab-text: rgba(232, 224, 255) !important; @@ -16319,17 +16469,17 @@ [lwtheme] ) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"]:is( - :-moz-lwtheme, - [lwtheme] - ) + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"]:is( - :-moz-lwtheme, - [lwtheme] - ) + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox { --lwt-tabs-border-color: var(--focus-outline-color) !important; } @@ -16341,12 +16491,15 @@ [lwtheme] ) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"] #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"][lwtheme-image]:is( - :-moz-lwtheme, - [lwtheme] - ) + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"][lwtheme-image]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"] #navigator-toolbox, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"][lwtheme-image]:is( @@ -16354,42 +16507,63 @@ [lwtheme] ) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"][lwtheme-image]:is( - :-moz-lwtheme, - [lwtheme] - ) + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"][lwtheme-image]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox { background-color: var(--lwt-accent-color) !important; } :root[privatebrowsingmode="temporary"] #TabsToolbar, :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"])[privatebrowsingmode="temporary"] #TabsToolbar, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"] #TabsToolbar, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"] #TabsToolbar, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] #TabsToolbar { --lwt-tab-line-color: var(--focus-outline-color) !important; } :root[privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"], :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"])[privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"], - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"], :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"] { --message-bar-text-color: var(--lwt-tab-text) !important; --in-content-page-color: var(--lwt-tab-text) !important; } :root[privatebrowsingmode="temporary"] menupopup, :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"])[privatebrowsingmode="temporary"] menupopup, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"] menupopup, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"] menupopup, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] menupopup { --menuitem-hover-background-color: #413d54 !important; --menu-background-color: #1d1935 !important; @@ -16544,16 +16718,28 @@ } } @media (-moz-bool-pref: "userChrome.theme.fully_color") { - :root[lwtheme-mozlightdark] menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]), - :root[lwtheme-mozlightdark] menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup), + :root[lwtheme-mozlightdark], :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);"] + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ), + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) ) menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]), + :root[lwtheme-mozlightdark], :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);"] + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ), + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) ) menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) { --menu-color: var(--toolbar-color, var(--in-content-page-color)) !important; @@ -22328,9 +22514,9 @@ filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); } :root:is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([selected], [multiselected]) @@ -22339,16 +22525,16 @@ filter: drop-shadow(0 0 1px var(--uc-tab-shadow-color, transparent)); } :root:is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected]:not(:focus), :root:is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[multiselected]:not([visuallyselected]) { @@ -22357,9 +22543,11 @@ /* For themes outside of Light and Dark (which are curated by Mozilla), show a thicker border around the tab to help themes that are dependent on tab_line to show the selected tab. */ :root:not( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] - ):is(:-moz-lwtheme, [lwtheme]) + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + ) #TabsToolbar:not([brighttext]) #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected], [multiselected]) @@ -22370,9 +22558,11 @@ drop-shadow(1px -1px 0px var(--uc-tab-shadow-color, transparent)) drop-shadow(0 0 2px rgba(128, 128, 142, 0.5)); } :root:not( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected], [multiselected]) @@ -22479,18 +22669,18 @@ } } @media (-moz-bool-pref: "userChrome.tab.bottom_rounded_corner") and (not (-moz-bool-pref: "userChrome.tab.bottom_rounded_corner.wave")) and (not (-moz-bool-pref: "userChrome.tab.bottom_rounded_corner.australis")) and (not (-moz-bool-pref: "userChrome.tab.bottom_rounded_corner.chrome")) and (not (-moz-bool-pref: "userChrome.tab.bottom_rounded_corner.chrome_legacy")) and (not (-moz-bool-pref: "userChrome.tab.bottom_rounded_corner.edge")) { - :root:not([customizing="true"])::is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + :root:not([customizing="true"]):is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected] .tab-background::before, - :root:not([customizing="true"])::is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + :root:not([customizing="true"]):is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected] @@ -22880,9 +23070,17 @@ border-radius: var(--tab-border-radius, 4px) var(--tab-border-radius, 4px) 0 0 !important; } :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]), - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] .tab-context-line, + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + .tab-context-line, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] .tab-context-line { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) + .tab-context-line { --tab-line-color: rgb(10, 132, 255); } .tabbrowser-tab:is([selected], [multiselected]) .tab-context-line { @@ -22975,9 +23173,17 @@ } /* selected tab style */ :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]), - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] .tab-context-line, + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + .tab-context-line, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] .tab-context-line { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) + .tab-context-line { --tab-line-color: #45a1ff; } .tabbrowser-tab:is([selected], [multiselected]) .tab-context-line::before { diff --git a/css/leptonChromeESR.css b/css/leptonChromeESR.css index 1b477d1..b29fc44 100644 --- a/css/leptonChromeESR.css +++ b/css/leptonChromeESR.css @@ -5,24 +5,38 @@ @supports -moz-bool-pref("userChrome.theme.built_in_contrast") { /*= Lightmode - Color darker =================================================*/ :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]), - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] { + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) { --lwt-accent-color: rgb(229, 229, 235) !important; /* Original: rgb(240, 240, 244) */ } @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] #navigator-toolbox { + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + #navigator-toolbox { background-color: var(--lwt-accent-color) !important; } } @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] #navigator-toolbox { + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + #navigator-toolbox { background-color: var(--lwt-accent-color) !important; } } /*= Darkmode - Color lighter =================================================*/ :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) { --toolbar-bgcolor: rgba(43, 42, 51, 5) !important; /* Original: rgba(43, 42, 51, 1) */ } } @@ -988,9 +1002,16 @@ > .tabbrowser-tab > .tab-stack > .tab-background[multiselected]:not([selected]), + :root[lwtheme-mozlightdark], :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);"] + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ), + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) ) #tabbrowser-tabs:not([movingtab]) > #pinned-tabs-container @@ -1009,9 +1030,16 @@ > .tabbrowser-tab > .tab-stack > .tab-background[multiselected]:not([selected]), + :root[lwtheme-mozlightdark], :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);"] + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ), + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) ) #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox @@ -1322,7 +1350,10 @@ > .tabbrowser-tab > .tab-stack > .tab-background[selected], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][lwt-default-theme-in-dark-mode] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #tabbrowser-tabs:not([movingtab]) > #pinned-tabs-container > .tabbrowser-tab @@ -1334,7 +1365,10 @@ > .tabbrowser-tab > .tab-stack > .tab-background[selected], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][lwt-default-theme-in-dark-mode] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab @@ -1973,7 +2007,10 @@ --in-content-link-color-visited: var(--blue-40) !important; } :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) { --button-primary-color: var(--in-content-page-color) !important; --button-primary-bgcolor: var(--blue-60) !important; --button-primary-hover-bgcolor: var(--blue-50) !important; @@ -1986,7 +2023,11 @@ } @supports -moz-bool-pref("userChrome.decoration.download_panel") { :root[lwtheme-mozlightdark][lwthemetextcolor="bright"] #downloadsListBox, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] #downloadsListBox { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) + #downloadsListBox { --button-primary-bgcolor: var(--blue-30); --button-primary-hover-bgcolor: var(--blue-20); } @@ -1997,9 +2038,15 @@ @supports -moz-bool-pref("userChrome.theme.private") { :root[privatebrowsingmode="temporary"], :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"])[privatebrowsingmode="temporary"], - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"], + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"], :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] { --lwt-additional-images: none !important; --lwt-header-image: none !important; --lwt-tab-text: rgba(232, 224, 255) !important; @@ -2033,17 +2080,17 @@ [lwtheme] ) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"]:is( - :-moz-lwtheme, - [lwtheme] - ) + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"]:is( - :-moz-lwtheme, - [lwtheme] - ) + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox { --lwt-tabs-border-color: var(--focus-outline-color) !important; } @@ -2055,12 +2102,15 @@ [lwtheme] ) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"] #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"][lwtheme-image]:is( - :-moz-lwtheme, - [lwtheme] - ) + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"][lwtheme-image]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"] #navigator-toolbox, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"][lwtheme-image]:is( @@ -2068,42 +2118,63 @@ [lwtheme] ) #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] #navigator-toolbox, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"][lwtheme-image]:is( - :-moz-lwtheme, - [lwtheme] - ) + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"][lwtheme-image]:is(:-moz-lwtheme, [lwtheme]) #navigator-toolbox { background-color: var(--lwt-accent-color) !important; } :root[privatebrowsingmode="temporary"] #TabsToolbar, :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"])[privatebrowsingmode="temporary"] #TabsToolbar, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"] #TabsToolbar, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"] #TabsToolbar, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] #TabsToolbar { --lwt-tab-line-color: var(--focus-outline-color) !important; } :root[privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"], :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"])[privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"], - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"], :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] notification-message[message-bar-type="infobar"] { --message-bar-text-color: var(--lwt-tab-text) !important; --in-content-page-color: var(--lwt-tab-text) !important; } :root[privatebrowsingmode="temporary"] menupopup, :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"])[privatebrowsingmode="temporary"] menupopup, - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + )[privatebrowsingmode="temporary"] menupopup, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"][privatebrowsingmode="temporary"] menupopup, - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][privatebrowsingmode="temporary"] + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + )[privatebrowsingmode="temporary"] menupopup { --menuitem-hover-background-color: #413d54 !important; --menu-background-color: #1d1935 !important; @@ -2253,16 +2324,28 @@ */ } /* Default theme color preservation */ - :root[lwtheme-mozlightdark] menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]), - :root[lwtheme-mozlightdark] menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup), + :root[lwtheme-mozlightdark], :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);"] + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ), + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) ) menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]), + :root[lwtheme-mozlightdark], :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);"] + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ), + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) ) menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) { --menu-color: var(--toolbar-color, var(--in-content-page-color)) !important; @@ -7670,9 +7753,9 @@ filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); } :root:is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([selected], [multiselected]) @@ -7681,16 +7764,16 @@ filter: drop-shadow(0 0 1px var(--uc-tab-shadow-color, transparent)); } :root:is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected]:not(:focus), :root:is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[multiselected]:not([visuallyselected]) { @@ -7699,9 +7782,11 @@ /* For themes outside of Light and Dark (which are curated by Mozilla), show a thicker border around the tab to help themes that are dependent on tab_line to show the selected tab. */ :root:not( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] - ):is(:-moz-lwtheme, [lwtheme]) + :is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + ) #TabsToolbar:not([brighttext]) #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected], [multiselected]) @@ -7712,9 +7797,11 @@ drop-shadow(1px -1px 0px var(--uc-tab-shadow-color, transparent)) drop-shadow(0 0 2px rgba(128, 128, 142, 0.5)); } :root:not( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + :is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected], [multiselected]) @@ -7821,18 +7908,18 @@ opacity: 0.3; } } - :root:not([customizing="true"])::is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + :root:not([customizing="true"]):is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected] .tab-background::before, - :root:not([customizing="true"])::is( - [lwtheme-mozlightdark], - [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] - ):is(:-moz-lwtheme, [lwtheme]) + :root:not([customizing="true"]):is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected] @@ -8109,9 +8196,17 @@ border-radius: var(--tab-border-radius, 4px) var(--tab-border-radius, 4px) 0 0 !important; } :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]), - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] .tab-context-line, + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + .tab-context-line, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] .tab-context-line { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) + .tab-context-line { --tab-line-color: rgb(10, 132, 255); } .tabbrowser-tab:is([selected], [multiselected]) .tab-context-line { @@ -8199,9 +8294,17 @@ } /* selected tab style */ :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]), - :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] .tab-context-line, + :root:is( + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [builtintheme][devtoolstheme="light"] + ) + .tab-context-line, :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] .tab-context-line { + :root:is( + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], + [builtintheme][devtoolstheme="dark"] + ) + .tab-context-line { --tab-line-color: #45a1ff; } .tabbrowser-tab:is([selected], [multiselected]) .tab-context-line::before { diff --git a/src/tab/selected_tab/_bottom_rounded_corner.scss b/src/tab/selected_tab/_bottom_rounded_corner.scss index 533f73a..de1333f 100644 --- a/src/tab/selected_tab/_bottom_rounded_corner.scss +++ b/src/tab/selected_tab/_bottom_rounded_corner.scss @@ -94,8 +94,7 @@ } } - &::is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"])#{$lwtheme} - #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected] .tab-background { + &#{$builtInDarkStyle} #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected] .tab-background { &::before, &::after { /* As Selected Tab - Box Shadow */ diff --git a/src/tab/selected_tab/_box_shadow.scss b/src/tab/selected_tab/_box_shadow.scss index 86a07ed..499d3ef 100644 --- a/src/tab/selected_tab/_box_shadow.scss +++ b/src/tab/selected_tab/_box_shadow.scss @@ -17,7 +17,7 @@ $ucTabBackgroundShadowHard: drop-shadow(-1px 0px 0px var(--uc-tab-shadow-color, filter: $ucTabBasicShadow; } -:root:is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"])#{$lwtheme} +:root#{$builtInDarkStyle} #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab { &:is([selected], [multiselected]) { > .tab-stack @@ -37,7 +37,7 @@ $ucTabBackgroundShadowHard: drop-shadow(-1px 0px 0px var(--uc-tab-shadow-color, /* For themes outside of Light and Dark (which are curated by Mozilla), show a thicker border around the tab to help themes that are dependent on tab_line to show the selected tab. */ -:root:not([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"])#{$lwtheme} +:root:not(#{$builtInLightStyle}) #TabsToolbar:not([brighttext]) #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected], [multiselected]) @@ -48,7 +48,7 @@ $ucTabBackgroundShadowHard: drop-shadow(-1px 0px 0px var(--uc-tab-shadow-color, $ucTabAdditionalShadow; } -:root:not([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"])#{$lwtheme} +:root:not(#{$builtInDarkStyle}) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected], [multiselected]) diff --git a/src/theme/_fully_color.scss b/src/theme/_fully_color.scss index 2808b0a..03ee6a1 100644 --- a/src/theme/_fully_color.scss +++ b/src/theme/_fully_color.scss @@ -100,10 +100,8 @@ html#main-window menupopup:not(.in-menulist) { } /* Default theme color preservation */ -:root[lwtheme-mozlightdark] menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]), /* Legacy */ -:root[lwtheme-mozlightdark] menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup), /* Legacy */ -: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"]), -: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) { +#{built-in-default-theme()} menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]), +#{built-in-default-theme()} menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) { --menu-color: var(--toolbar-color, var(--in-content-page-color)) !important; --arrowpanel-background: var( --toolbar-bgcolor, diff --git a/src/theme/system_default_theme/_mac.scss b/src/theme/system_default_theme/_mac.scss index 8f34b91..b32aa10 100644 --- a/src/theme/system_default_theme/_mac.scss +++ b/src/theme/system_default_theme/_mac.scss @@ -247,7 +247,7 @@ > .tabbrowser-tab > .tab-stack > .tab-background[selected], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][lwt-default-theme-in-dark-mode] + :root#{$builtInDarkStyle} #tabbrowser-tabs:not([movingtab]) > #pinned-tabs-container > .tabbrowser-tab @@ -259,7 +259,7 @@ > .tabbrowser-tab > .tab-stack > .tab-background[selected], - :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][lwt-default-theme-in-dark-mode] + :root#{$builtInDarkStyle} #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab diff --git a/src/theme/system_default_theme/_win10.scss b/src/theme/system_default_theme/_win10.scss index 0b5f1b4..42167db 100644 --- a/src/theme/system_default_theme/_win10.scss +++ b/src/theme/system_default_theme/_win10.scss @@ -354,7 +354,7 @@ > .tabbrowser-tab > .tab-stack > .tab-background[multiselected]:not([selected]), - :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);"]) + #{built-in-default-theme()} #tabbrowser-tabs:not([movingtab]) > #pinned-tabs-container > .tabbrowser-tab @@ -372,7 +372,7 @@ > .tabbrowser-tab > .tab-stack > .tab-background[multiselected]:not([selected]), - :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);"]) + #{built-in-default-theme()} #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab diff --git a/src/utils/_theme.scss b/src/utils/_theme.scss index 509baf9..2df04b2 100644 --- a/src/utils/_theme.scss +++ b/src/utils/_theme.scss @@ -9,13 +9,13 @@ $_lightText: '[lwthemetextcolor="bright"]'; $_darkText: ":not(#{$_lightText})"; $_sysDark: "[lwt-default-theme-in-dark-mode]"; -$_lightStyle: '[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"]'; -$_darkStyle: '[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]'; +$builtInLightStyle: ':is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [builtintheme][devtoolstheme="light"])'; +$builtInDarkStyle: ':is([style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], [builtintheme][devtoolstheme="dark"])'; //== Mixin ===================================================================== @function built-in-default-theme() { $oldDefault: selector.append(":root", $_lightdark); - $newDefault: selector.append(":root", ":is(#{$_lightStyle}, #{$_darkStyle})"); + $newDefault: selector.append(":root", ":is(#{$builtInLightStyle}, #{$builtInDarkStyle})"); @return "#{$oldDefault}, #{$newDefault}"; } @@ -29,14 +29,14 @@ $_darkStyle: '[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rg @function built-in-light-theme() { $oldLight: selector.append(":root", $_lightdark, $_darkText); - $newLight: selector.append(":root", $_lightStyle); + $newLight: selector.append(":root", $builtInLightStyle); @return "#{$oldLight}, #{$newLight}"; } @function built-in-dark-theme() { $oldDark: selector.append(":root", $_lightdark, $_lightText); - $newDark: selector.append(":root", $_darkStyle); + $newDark: selector.append(":root", $builtInDarkStyle); @return "#{$oldDark}, #{$newDark}"; } From 9477ffc951566dca9ba75ec0c7f05e6c50f8d976 Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Thu, 18 Dec 2025 00:00:00 +0900 Subject: [PATCH 03/12] Fix: Tab Groups - calc bug #1140 --- css/leptonChrome.css | 52 +++++++++++++++++++-------------------- css/leptonChromeESR.css | 26 ++++++++++---------- src/rounding/_square.scss | 26 ++++++++++---------- 3 files changed, 52 insertions(+), 52 deletions(-) diff --git a/css/leptonChrome.css b/css/leptonChrome.css index 1db0abb..59b313a 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -4045,7 +4045,7 @@ @media -moz-pref("userChrome.rounding.square_tab") { :root { - --tab-border-radius: 0 !important; /* Original: 4px */ + --tab-border-radius: 0px !important; /* Original: 4px */ } } @media not -moz-pref("userChrome.rounding.square_tab") { @@ -4055,7 +4055,7 @@ } @media -moz-pref("userChrome.rounding.square_button") { :root { - --urlbar-icon-border-radius: 0 !important; /* Original: calc(var(--toolbarbutton-border-radius) - 1px); */ + --urlbar-icon-border-radius: 0px !important; /* Original: calc(var(--toolbarbutton-border-radius) - 1px); */ } .toolbarbutton-1, .toolbarbutton-icon, @@ -4066,7 +4066,7 @@ .urlbarView-action, toolbarbutton.bookmark-item:not(.subviewbutton), #sidebar-switcher-target { - --toolbarbutton-border-radius: 0; /* Original: 4px */ + --toolbarbutton-border-radius: 0px; /* Original: 4px */ } button, .close-icon, @@ -4075,7 +4075,7 @@ findbar toolbarbutton, .notification-button, #main-menubar > menu { - border-radius: 0 !important; + border-radius: 0px !important; } } @media -moz-pref("userChrome.rounding.square_tab") or -moz-pref("userChrome.rounding.square_button") { @@ -4087,13 +4087,13 @@ } @media -moz-pref("userChrome.rounding.square_panel") { :root { - --arrowpanel-border-radius: 0 !important; + --arrowpanel-border-radius: 0px !important; } } @media -moz-pref("userChrome.rounding.square_panelitem") { :root { - --arrowpanel-menuitem-border-radius: 0 !important; - --subviewbutton-border-radius: 0 !important; + --arrowpanel-menuitem-border-radius: 0px !important; + --subviewbutton-border-radius: 0px !important; } } @media -moz-pref("userChrome.rounding.square_menupopup") { @@ -4107,17 +4107,17 @@ xul|menulist > xul|menupopup xul|menu, xul|menulist > xul|menupopup xul|menuitem, .customization-uidensity-menuitem { - border-radius: 0 !important; + border-radius: 0px !important; } } @media -moz-pref("userChrome.rounding.square_infobox") { #sanitizeEverythingWarningBox { - border-radius: 0 !important; + border-radius: 0px !important; } } @media -moz-pref("userChrome.rounding.square_toolbar") { :root { - --uc-rounding-toolbar: 0; + --uc-rounding-toolbar: 0px; } .container.infobar, .container.infobar::before, @@ -4141,19 +4141,19 @@ #urlbar-input-container, #urlbar-background, #searchbar { - --toolbarbutton-border-radius: 0; + --toolbarbutton-border-radius: 0px; } } @media -moz-pref("userChrome.rounding.square_urlView_item") { .urlbarView-row, .urlbarView-row-inner { - --toolbarbutton-border-radius: 0; + --toolbarbutton-border-radius: 0px; } } @media -moz-pref("userChrome.rounding.square_checklabel") { input[type="checkbox"], .checkbox-check { - border-radius: 0 !important; + border-radius: 0px !important; } } @media -moz-pref("userChrome.rounding.square_dialog") { @@ -18800,7 +18800,7 @@ @media (-moz-bool-pref: "userChrome.rounding.square_tab") { :root { - --tab-border-radius: 0 !important; /* Original: 4px */ + --tab-border-radius: 0px !important; /* Original: 4px */ } } @media not (-moz-bool-pref: "userChrome.rounding.square_tab") { @@ -18810,7 +18810,7 @@ } @media (-moz-bool-pref: "userChrome.rounding.square_button") { :root { - --urlbar-icon-border-radius: 0 !important; /* Original: calc(var(--toolbarbutton-border-radius) - 1px); */ + --urlbar-icon-border-radius: 0px !important; /* Original: calc(var(--toolbarbutton-border-radius) - 1px); */ } .toolbarbutton-1, .toolbarbutton-icon, @@ -18821,7 +18821,7 @@ .urlbarView-action, toolbarbutton.bookmark-item:not(.subviewbutton), #sidebar-switcher-target { - --toolbarbutton-border-radius: 0; /* Original: 4px */ + --toolbarbutton-border-radius: 0px; /* Original: 4px */ } button, .close-icon, @@ -18830,7 +18830,7 @@ findbar toolbarbutton, .notification-button, #main-menubar > menu { - border-radius: 0 !important; + border-radius: 0px !important; } } @media (-moz-bool-pref: "userChrome.rounding.square_tab"), (-moz-bool-pref: "userChrome.rounding.square_button") { @@ -18842,13 +18842,13 @@ } @media (-moz-bool-pref: "userChrome.rounding.square_panel") { :root { - --arrowpanel-border-radius: 0 !important; + --arrowpanel-border-radius: 0px !important; } } @media (-moz-bool-pref: "userChrome.rounding.square_panelitem") { :root { - --arrowpanel-menuitem-border-radius: 0 !important; - --subviewbutton-border-radius: 0 !important; + --arrowpanel-menuitem-border-radius: 0px !important; + --subviewbutton-border-radius: 0px !important; } } @media (-moz-bool-pref: "userChrome.rounding.square_menupopup") { @@ -18862,17 +18862,17 @@ xul|menulist > xul|menupopup xul|menu, xul|menulist > xul|menupopup xul|menuitem, .customization-uidensity-menuitem { - border-radius: 0 !important; + border-radius: 0px !important; } } @media (-moz-bool-pref: "userChrome.rounding.square_infobox") { #sanitizeEverythingWarningBox { - border-radius: 0 !important; + border-radius: 0px !important; } } @media (-moz-bool-pref: "userChrome.rounding.square_toolbar") { :root { - --uc-rounding-toolbar: 0; + --uc-rounding-toolbar: 0px; } .container.infobar, .container.infobar::before, @@ -18896,19 +18896,19 @@ #urlbar-input-container, #urlbar-background, #searchbar { - --toolbarbutton-border-radius: 0; + --toolbarbutton-border-radius: 0px; } } @media (-moz-bool-pref: "userChrome.rounding.square_urlView_item") { .urlbarView-row, .urlbarView-row-inner { - --toolbarbutton-border-radius: 0; + --toolbarbutton-border-radius: 0px; } } @media (-moz-bool-pref: "userChrome.rounding.square_checklabel") { input[type="checkbox"], .checkbox-check { - border-radius: 0 !important; + border-radius: 0px !important; } } @media (-moz-bool-pref: "userChrome.rounding.square_dialog") { diff --git a/css/leptonChromeESR.css b/css/leptonChromeESR.css index b29fc44..cdcae4c 100644 --- a/css/leptonChromeESR.css +++ b/css/leptonChromeESR.css @@ -4366,7 +4366,7 @@ @supports -moz-bool-pref("userChrome.rounding.square_tab") { :root { - --tab-border-radius: 0 !important; /* Original: 4px */ + --tab-border-radius: 0px !important; /* Original: 4px */ } } @supports not -moz-bool-pref("userChrome.rounding.square_tab") { @@ -4376,7 +4376,7 @@ } @supports -moz-bool-pref("userChrome.rounding.square_button") { :root { - --urlbar-icon-border-radius: 0 !important; /* Original: calc(var(--toolbarbutton-border-radius) - 1px); */ + --urlbar-icon-border-radius: 0px !important; /* Original: calc(var(--toolbarbutton-border-radius) - 1px); */ } .toolbarbutton-1, .toolbarbutton-icon, @@ -4387,7 +4387,7 @@ .urlbarView-action, toolbarbutton.bookmark-item:not(.subviewbutton), #sidebar-switcher-target { - --toolbarbutton-border-radius: 0; /* Original: 4px */ + --toolbarbutton-border-radius: 0px; /* Original: 4px */ } button, .close-icon, @@ -4396,7 +4396,7 @@ findbar toolbarbutton, .notification-button, #main-menubar > menu { - border-radius: 0 !important; + border-radius: 0px !important; } } @supports -moz-bool-pref("userChrome.rounding.square_tab") or -moz-bool-pref("userChrome.rounding.square_button") { @@ -4408,13 +4408,13 @@ } @supports -moz-bool-pref("userChrome.rounding.square_panel") { :root { - --arrowpanel-border-radius: 0 !important; + --arrowpanel-border-radius: 0px !important; } } @supports -moz-bool-pref("userChrome.rounding.square_panelitem") { :root { - --arrowpanel-menuitem-border-radius: 0 !important; - --subviewbutton-border-radius: 0 !important; + --arrowpanel-menuitem-border-radius: 0px !important; + --subviewbutton-border-radius: 0px !important; } } @supports -moz-bool-pref("userChrome.rounding.square_menupopup") { @@ -4428,17 +4428,17 @@ xul|menulist > xul|menupopup xul|menu, xul|menulist > xul|menupopup xul|menuitem, .customization-uidensity-menuitem { - border-radius: 0 !important; + border-radius: 0px !important; } } @supports -moz-bool-pref("userChrome.rounding.square_infobox") { #sanitizeEverythingWarningBox { - border-radius: 0 !important; + border-radius: 0px !important; } } @supports -moz-bool-pref("userChrome.rounding.square_toolbar") { :root { - --uc-rounding-toolbar: 0; + --uc-rounding-toolbar: 0px; } .container.infobar, .container.infobar::before, @@ -4462,19 +4462,19 @@ #urlbar-input-container, #urlbar-background, #searchbar { - --toolbarbutton-border-radius: 0; + --toolbarbutton-border-radius: 0px; } } @supports -moz-bool-pref("userChrome.rounding.square_urlView_item") { .urlbarView-row, .urlbarView-row-inner { - --toolbarbutton-border-radius: 0; + --toolbarbutton-border-radius: 0px; } } @supports -moz-bool-pref("userChrome.rounding.square_checklabel") { input[type="checkbox"], .checkbox-check { - border-radius: 0 !important; + border-radius: 0px !important; } } @supports -moz-bool-pref("userChrome.rounding.square_dialog") { diff --git a/src/rounding/_square.scss b/src/rounding/_square.scss index 3140184..a2a0341 100644 --- a/src/rounding/_square.scss +++ b/src/rounding/_square.scss @@ -1,6 +1,6 @@ @include Option("userChrome.rounding.square_tab") { :root { - --tab-border-radius: 0 !important; /* Original: 4px */ + --tab-border-radius: 0px !important; /* Original: 4px */ } } @include NotOption("userChrome.rounding.square_tab") { @@ -10,7 +10,7 @@ } @include Option("userChrome.rounding.square_button") { :root { - --urlbar-icon-border-radius: 0 !important; /* Original: calc(var(--toolbarbutton-border-radius) - 1px); */ + --urlbar-icon-border-radius: 0px !important; /* Original: calc(var(--toolbarbutton-border-radius) - 1px); */ } .toolbarbutton-1, @@ -22,7 +22,7 @@ .urlbarView-action, toolbarbutton.bookmark-item:not(.subviewbutton), #sidebar-switcher-target { - --toolbarbutton-border-radius: 0; /* Original: 4px */ + --toolbarbutton-border-radius: 0px; /* Original: 4px */ } button, @@ -32,7 +32,7 @@ findbar toolbarbutton, .notification-button, #main-menubar > menu { - border-radius: 0 !important; + border-radius: 0px !important; } } @include Option("userChrome.rounding.square_tab", "userChrome.rounding.square_button") { @@ -45,13 +45,13 @@ @include Option("userChrome.rounding.square_panel") { :root { - --arrowpanel-border-radius: 0 !important; + --arrowpanel-border-radius: 0px !important; } } @include Option("userChrome.rounding.square_panelitem") { :root { - --arrowpanel-menuitem-border-radius: 0 !important; - --subviewbutton-border-radius: 0 !important; + --arrowpanel-menuitem-border-radius: 0px !important; + --subviewbutton-border-radius: 0px !important; } } @@ -66,19 +66,19 @@ xul|menulist > xul|menupopup xul|menu, xul|menulist > xul|menupopup xul|menuitem, .customization-uidensity-menuitem { - border-radius: 0 !important; + border-radius: 0px !important; } } @include Option("userChrome.rounding.square_infobox") { #sanitizeEverythingWarningBox { - border-radius: 0 !important; + border-radius: 0px !important; } } @include Option("userChrome.rounding.square_toolbar") { :root { - --uc-rounding-toolbar: 0; + --uc-rounding-toolbar: 0px; } .container.infobar, @@ -105,20 +105,20 @@ #urlbar-input-container, #urlbar-background, #searchbar { - --toolbarbutton-border-radius: 0; + --toolbarbutton-border-radius: 0px; } } @include Option("userChrome.rounding.square_urlView_item") { .urlbarView-row, // At FF v111 #668 .urlbarView-row-inner { - --toolbarbutton-border-radius: 0; + --toolbarbutton-border-radius: 0px; } } @include Option("userChrome.rounding.square_checklabel") { input[type="checkbox"], .checkbox-check { - border-radius: 0 !important; + border-radius: 0px !important; } } From 3087a6cadbbade9ca1fc84df48bfd09d475dee86 Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Fri, 19 Dec 2025 00:00:00 +0900 Subject: [PATCH 04/12] Fix: Tab - Container size adjust for vertical tab #1095 --- css/leptonChrome.css | 10 ++++++---- css/leptonChromeESR.css | 5 +++-- src/tab/_container_tab.scss | 5 +++-- 3 files changed, 12 insertions(+), 8 deletions(-) diff --git a/css/leptonChrome.css b/css/leptonChrome.css index 59b313a..966ea8c 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -9038,10 +9038,11 @@ display: block; position: absolute; top: 50%; + left: var(--tab-inline-padding); transform: translate(var(--uc-container-position-x), var(--uc-container-position-y)); /* Shape */ border-bottom: 2px solid var(--identity-icon-color); - width: calc(100% - 30px); + width: calc(100% - (var(--tab-inline-padding) + var(--tab-inner-inline-margin)) * 2); opacity: 0.75; } .tabbrowser-tab[visuallyselected] .tab-content::before { @@ -9052,7 +9053,7 @@ width: 25%; } .tabbrowser-tab[visuallyselected]:not([pinned]) .tab-content::before { - width: calc(100% - 30px); + width: calc(100% - (var(--tab-inline-padding) + var(--tab-inner-inline-margin)) * 2); } #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab[visuallyselected]:not([pinned]) .tab-content::before { width: calc(100% - 33px); @@ -24436,10 +24437,11 @@ display: block; position: absolute; top: 50%; + left: var(--tab-inline-padding); transform: translate(var(--uc-container-position-x), var(--uc-container-position-y)); /* Shape */ border-bottom: 2px solid var(--identity-icon-color); - width: calc(100% - 30px); + width: calc(100% - (var(--tab-inline-padding) + var(--tab-inner-inline-margin)) * 2); opacity: 0.75; } } @@ -24453,7 +24455,7 @@ width: 25%; } .tabbrowser-tab[visuallyselected]:not([pinned]) .tab-content::before { - width: calc(100% - 30px); + width: calc(100% - (var(--tab-inline-padding) + var(--tab-inner-inline-margin)) * 2); } #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab[visuallyselected]:not([pinned]) .tab-content::before { width: calc(100% - 33px); diff --git a/css/leptonChromeESR.css b/css/leptonChromeESR.css index cdcae4c..e09a800 100644 --- a/css/leptonChromeESR.css +++ b/css/leptonChromeESR.css @@ -9497,10 +9497,11 @@ display: block; position: absolute; top: 50%; + left: var(--tab-inline-padding); transform: translate(var(--uc-container-position-x), var(--uc-container-position-y)); /* Shape */ border-bottom: 2px solid var(--identity-icon-color); - width: calc(100% - 30px); + width: calc(100% - (var(--tab-inline-padding) + var(--tab-inner-inline-margin)) * 2); opacity: 0.75; } .tabbrowser-tab[visuallyselected] .tab-content::before { @@ -9511,7 +9512,7 @@ width: 25%; } .tabbrowser-tab[visuallyselected]:not([pinned]) .tab-content::before { - width: calc(100% - 30px); + width: calc(100% - (var(--tab-inline-padding) + var(--tab-inner-inline-margin)) * 2); } #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab[visuallyselected]:not([pinned]) .tab-content::before { width: calc(100% - 33px); diff --git a/src/tab/_container_tab.scss b/src/tab/_container_tab.scss index 311680b..3043e3e 100644 --- a/src/tab/_container_tab.scss +++ b/src/tab/_container_tab.scss @@ -35,11 +35,12 @@ display: block; position: absolute; top: 50%; + left: var(--tab-inline-padding); transform: translate(var(--uc-container-position-x), var(--uc-container-position-y)); /* Shape */ border-bottom: 2px solid var(--identity-icon-color); - width: calc(100% - 30px); + width: calc(100% - (var(--tab-inline-padding) + var(--tab-inner-inline-margin)) * 2); opacity: 0.75; } .tabbrowser-tab[visuallyselected] .tab-content::before { @@ -51,7 +52,7 @@ width: 25%; } .tabbrowser-tab[visuallyselected]:not([pinned]) .tab-content::before { - width: calc(100% - 30px); + width: calc(100% - (var(--tab-inline-padding) + var(--tab-inner-inline-margin)) * 2); } #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab[visuallyselected]:not([pinned]) .tab-content::before { width: calc(100% - 33px); From c0dca2b348f3e10fda2e89254ddd95fa28097ae0 Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Sat, 20 Dec 2025 00:00:00 +0900 Subject: [PATCH 05/12] Fix: Tab - Vertical tab with tab group #1095 --- css/leptonChrome.css | 28 +++++++++++++++++++++++++++ css/leptonChromeESR.css | 14 ++++++++++++++ src/tab/selected_tab/_box_shadow.scss | 13 +++++++++++++ 3 files changed, 55 insertions(+) diff --git a/css/leptonChrome.css b/css/leptonChrome.css index 966ea8c..ac04439 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -7311,6 +7311,20 @@ ); --uc-tab-shadow-color-bundle: var(--tab-line-color, var(--lwt-tab-line-color, rgba(128, 128, 142, 0.9))); } + #tabbrowser-tabs:not([noshadowfortests]) { + /* filter create new stacking context */ + } + #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { + box-shadow: unset !important; + filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); + } + #tabbrowser-tabs:not([noshadowfortests])[expanded][orient="horizontal"] + .tab-background:is([selected], [multiselected]) + .tab-group-line { + height: calc(100% + 5px + var(--tab-block-margin)); + left: calc(-1 * var(--tab-inner-inline-margin)); + transform: translateY(-2px); + } #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { box-shadow: unset !important; filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); @@ -22510,6 +22524,20 @@ ); --uc-tab-shadow-color-bundle: var(--tab-line-color, var(--lwt-tab-line-color, rgba(128, 128, 142, 0.9))); } + #tabbrowser-tabs:not([noshadowfortests]) { + /* filter create new stacking context */ + } + #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { + box-shadow: unset !important; + filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); + } + #tabbrowser-tabs:not([noshadowfortests])[expanded][orient="horizontal"] + .tab-background:is([selected], [multiselected]) + .tab-group-line { + height: calc(100% + 5px + var(--tab-block-margin)); + left: calc(-1 * var(--tab-inner-inline-margin)); + transform: translateY(-2px); + } #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { box-shadow: unset !important; filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); diff --git a/css/leptonChromeESR.css b/css/leptonChromeESR.css index e09a800..6e38098 100644 --- a/css/leptonChromeESR.css +++ b/css/leptonChromeESR.css @@ -7748,6 +7748,20 @@ ); --uc-tab-shadow-color-bundle: var(--tab-line-color, var(--lwt-tab-line-color, rgba(128, 128, 142, 0.9))); } + #tabbrowser-tabs:not([noshadowfortests]) { + /* filter create new stacking context */ + } + #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { + box-shadow: unset !important; + filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); + } + #tabbrowser-tabs:not([noshadowfortests])[expanded][orient="horizontal"] + .tab-background:is([selected], [multiselected]) + .tab-group-line { + height: calc(100% + 5px + var(--tab-block-margin)); + left: calc(-1 * var(--tab-inner-inline-margin)); + transform: translateY(-2px); + } #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { box-shadow: unset !important; filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); diff --git a/src/tab/selected_tab/_box_shadow.scss b/src/tab/selected_tab/_box_shadow.scss index 499d3ef..c9be03b 100644 --- a/src/tab/selected_tab/_box_shadow.scss +++ b/src/tab/selected_tab/_box_shadow.scss @@ -12,6 +12,19 @@ $ucTabBackgroundShadowHard: drop-shadow(-1px 0px 0px var(--uc-tab-shadow-color, --uc-tab-shadow-color-bundle: var(--tab-line-color, var(--lwt-tab-line-color, rgba(128, 128, 142, 0.9))); } +#tabbrowser-tabs:not([noshadowfortests]) { + .tab-background:is([selected], [multiselected]) { + box-shadow: unset !important; + filter: $ucTabBasicShadow; + } + + /* filter create new stacking context */ + &[expanded][orient="vertical"] .tab-background:is([selected], [multiselected]) .tab-group-line { + height: calc(100% + 6px + var(--tab-block-margin)); // 6px: .tab-group-line's inset-block size + left: calc(-1 * var(--tab-inner-inline-margin)); + transform: translateY(-2px); // .tab-group-line 's inset-inline-start size + } +} #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { box-shadow: unset !important; filter: $ucTabBasicShadow; From c58e2464d807c521bdf75e6cf8a88998b13b9d7c Mon Sep 17 00:00:00 2001 From: Seth Kinast Date: Fri, 19 Dec 2025 21:56:47 -0500 Subject: [PATCH 06/12] add Waterfox Flatpak profile path to install script --- install.sh | 1 + 1 file changed, 1 insertion(+) diff --git a/install.sh b/install.sh index ab47194..c051d24 100755 --- a/install.sh +++ b/install.sh @@ -345,6 +345,7 @@ firefoxProfileDirPaths=( "${HOME}/.local/opt/tor-browser/app/Browser/TorBrowser/Data/Browser" "${HOME}/.var/app/org.mozilla.firefox/.mozilla/firefox" "${HOME}/.var/app/io.gitlab.librewolf-community/.librewolf" + "${HOME}/.var/app/net.waterfox.waterfox/.waterfox" "${HOME}/snap/firefox/common/.mozilla/firefox" "${HOME}/Library/Application Support/Firefox" "${HOME}/Library/Application Support/Waterfox" From a6546e69555aff1d82760a3a4e3f9fa3d77cf2c7 Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Sun, 21 Dec 2025 00:00:00 +0900 Subject: [PATCH 07/12] Fix: Tab - Vertical Tab with close button #1095 --- css/leptonChrome.css | 26 +++++++++++++++++++ css/leptonChromeESR.css | 12 +++++++++ .../_show_close_button_at_hover.scss | 11 ++++++++ 3 files changed, 49 insertions(+) diff --git a/css/leptonChrome.css b/css/leptonChrome.css index ac04439..7bd0d8c 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -8629,6 +8629,18 @@ padding-inline-start: 3px !important; /* Original: 0px */ width: 19px !important; /* Redefine from 19px !important, Original: 17px = (width - padding) */ } + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-close-button { + padding: 2px !important; + width: 16px !important; + height: 16px !important; + background-image: linear-gradient(var(--close-button-extra-background)), + linear-gradient(var(--tab-selected-bgcolor, var(--toolbar-bgcolor))), linear-gradient(var(--toolbox-bgcolor)) !important; + } + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-close-button:-moz-window-inactive { + background-image: linear-gradient(var(--close-button-extra-background)), + linear-gradient(var(--tab-selected-bgcolor, var(--toolbar-bgcolor))), + linear-gradient(var(--toolbox-bgcolor-inactive)) !important; + } } /** Clipped tabs - Show close button at pinned tab ****************************/ @media -moz-pref("userChrome.tab.close_button_at_pinned") { @@ -24011,6 +24023,20 @@ width: 19px !important; /* Redefine from 19px !important, Original: 17px = (width - padding) */ } } +@media (-moz-bool-pref: "userChrome.tab.close_button_at_hover") { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-close-button { + padding: 2px !important; + width: 16px !important; + height: 16px !important; + background-image: linear-gradient(var(--close-button-extra-background)), + linear-gradient(var(--tab-selected-bgcolor, var(--toolbar-bgcolor))), linear-gradient(var(--toolbox-bgcolor)) !important; + } + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-close-button:-moz-window-inactive { + background-image: linear-gradient(var(--close-button-extra-background)), + linear-gradient(var(--tab-selected-bgcolor, var(--toolbar-bgcolor))), + linear-gradient(var(--toolbox-bgcolor-inactive)) !important; + } +} /** Clipped tabs - Show close button at pinned tab ****************************/ @media (-moz-bool-pref: "userChrome.tab.close_button_at_pinned") and (not (-moz-bool-pref: "userChrome.tabbar.as_titlebar")) { #tabbrowser-tabs { diff --git a/css/leptonChromeESR.css b/css/leptonChromeESR.css index 6e38098..fce8c4d 100644 --- a/css/leptonChromeESR.css +++ b/css/leptonChromeESR.css @@ -9088,6 +9088,18 @@ padding-inline-start: 3px !important; /* Original: 0px */ width: 19px !important; /* Redefine from 19px !important, Original: 17px = (width - padding) */ } + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-close-button { + padding: 2px !important; + width: 16px !important; + height: 16px !important; + background-image: linear-gradient(var(--close-button-extra-background)), + linear-gradient(var(--tab-selected-bgcolor, var(--toolbar-bgcolor))), linear-gradient(var(--toolbox-bgcolor)) !important; + } + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-close-button:-moz-window-inactive { + background-image: linear-gradient(var(--close-button-extra-background)), + linear-gradient(var(--tab-selected-bgcolor, var(--toolbar-bgcolor))), + linear-gradient(var(--toolbox-bgcolor-inactive)) !important; + } } /** Clipped tabs - Show close button at pinned tab ****************************/ @supports -moz-bool-pref("userChrome.tab.close_button_at_pinned") { diff --git a/src/tab/clipped_tab/_show_close_button_at_hover.scss b/src/tab/clipped_tab/_show_close_button_at_hover.scss index 34bda20..a1a44f4 100644 --- a/src/tab/clipped_tab/_show_close_button_at_hover.scss +++ b/src/tab/clipped_tab/_show_close_button_at_hover.scss @@ -79,3 +79,14 @@ padding-inline-start: 3px !important; /* Original: 0px */ width: 19px !important; /* Redefine from 19px !important, Original: 17px = (width - padding) */ } + +#tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-close-button { + padding: 2px !important; + width: 16px !important; + height: 16px !important; + background-image: linear-gradient(var(--close-button-extra-background)), linear-gradient(var(--tab-selected-bgcolor, var(--toolbar-bgcolor))), linear-gradient(var(--toolbox-bgcolor)) !important; + + &:-moz-window-inactive { + background-image: linear-gradient(var(--close-button-extra-background)), linear-gradient(var(--tab-selected-bgcolor, var(--toolbar-bgcolor))), linear-gradient(var(--toolbox-bgcolor-inactive)) !important; + } +} \ No newline at end of file From 8c63b02d3fdd24ecff856101b5cd57f347f108a7 Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Mon, 22 Dec 2025 00:00:00 +0900 Subject: [PATCH 08/12] Fix: Tab - Vertical layout #1095 --- css/leptonChrome.css | 174 ++++++++++++++++++++++---- css/leptonChromeESR.css | 87 +++++++++++-- src/tab/_container_tab.scss | 43 +++++-- src/tab/selected_tab/_box_shadow.scss | 9 +- 4 files changed, 266 insertions(+), 47 deletions(-) diff --git a/css/leptonChrome.css b/css/leptonChrome.css index 7bd0d8c..70fd890 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -7318,13 +7318,22 @@ box-shadow: unset !important; filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); } - #tabbrowser-tabs:not([noshadowfortests])[expanded][orient="horizontal"] + #tabbrowser-tabs:not([noshadowfortests])[orient="vertical"] .tab-background:is([selected], [multiselected]) .tab-group-line { - height: calc(100% + 5px + var(--tab-block-margin)); - left: calc(-1 * var(--tab-inner-inline-margin)); + height: calc(100% + 6px + var(--tab-block-margin)); transform: translateY(-2px); } + #tabbrowser-tabs:not([noshadowfortests])[expanded][orient="vertical"] + .tab-background:is([selected], [multiselected]) + .tab-group-line { + inset-inline-start: calc(-1 * var(--tab-inner-inline-margin)) !important; + } + #tabbrowser-tabs:not([noshadowfortests]):not([expanded])[orient="vertical"] + .tab-background:is([selected], [multiselected]) + .tab-group-line { + inset-inline-start: calc(-1 * var(--tab-inner-inline-margin) + 2px) !important; + } #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { box-shadow: unset !important; filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); @@ -9093,12 +9102,16 @@ } } /* Pinned Tab */ - .tabbrowser-tab[pinned] .tab-content::before { + .tabbrowser-tab[pinned] .tab-content::before, + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-content::before { transform: translateY(var(--uc-container-position-y)); - width: 16px; + width: 16px !important; } @media -moz-pref("userChrome.tab.close_button_at_pinned") { - .tabbrowser-tab[pinned][visuallyselected]:not([busy]):hover .tab-content::before { + .tabbrowser-tab[pinned][visuallyselected]:not([busy]):hover .tab-content::before, + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[visuallyselected]:not([busy]):hover + .tab-content::before { opacity: 0; } } @@ -9106,12 +9119,28 @@ .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected])::before, - .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected])::before { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image][usercontextid] + > .tab-stack + > .tab-content[attention]:not([selected])::before, + .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected])::before, + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[usercontextid] + > .tab-stack + > .tab-content[titlechanged]:not([selected])::before { opacity: 0; } /* Pinned Tab - Titlechanged Indicator override */ .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected]), - .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]) { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image][usercontextid] + > .tab-stack + > .tab-content[attention]:not([selected]), + .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[usercontextid] + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { /* Original: radial-gradient(circle, var(--attention-icon-color), var(--attention-icon-color) 2px, transparent 2px); */ --dotted-identity-image: radial-gradient( circle, @@ -9123,7 +9152,15 @@ background-position-x: var(--uc-titlechanged-container-position-x) !important; } .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected]), - .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]) { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image] + > .tab-stack + > .tab-content[attention]:not([selected]), + .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */ background-position-y: top var(--uc-container-position-y) !important; } @@ -9131,25 +9168,51 @@ .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image][usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[attention]:not([selected]), .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack - > .tab-content[pinned][titlechanged]:not([selected]) { + > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { --uc-titlechanged-container-position-x: calc(32% - 1px), calc(50% - 1px), calc(70% - 1px); } :root[uidensity="compact"] .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected]), + :root[uidensity="compact"] + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image][usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[attention]:not([selected]), :root[uidensity="compact"] .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack - > .tab-content[pinned][titlechanged]:not([selected]) { + > .tab-content[pinned][titlechanged]:not([selected]), + :root[uidensity="compact"] + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { --uc-titlechanged-container-position-x: calc(30% - 1px), calc(50% - 1px), calc(70% - 1px); } } @media -moz-pref("userChrome.tab.container.on_top") { .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected]), - .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]) { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image] + > .tab-stack + > .tab-content[attention]:not([selected]), + .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */ background-position-y: top var(--uc-container-position-y-bottom) !important; } @@ -22543,13 +22606,22 @@ box-shadow: unset !important; filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); } - #tabbrowser-tabs:not([noshadowfortests])[expanded][orient="horizontal"] + #tabbrowser-tabs:not([noshadowfortests])[orient="vertical"] .tab-background:is([selected], [multiselected]) .tab-group-line { - height: calc(100% + 5px + var(--tab-block-margin)); - left: calc(-1 * var(--tab-inner-inline-margin)); + height: calc(100% + 6px + var(--tab-block-margin)); transform: translateY(-2px); } + #tabbrowser-tabs:not([noshadowfortests])[expanded][orient="vertical"] + .tab-background:is([selected], [multiselected]) + .tab-group-line { + inset-inline-start: calc(-1 * var(--tab-inner-inline-margin)) !important; + } + #tabbrowser-tabs:not([noshadowfortests]):not([expanded])[orient="vertical"] + .tab-background:is([selected], [multiselected]) + .tab-group-line { + inset-inline-start: calc(-1 * var(--tab-inner-inline-margin) + 2px) !important; + } #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { box-shadow: unset !important; filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); @@ -24522,24 +24594,44 @@ } } @media (-moz-bool-pref: "userChrome.tab.container") and (not (-moz-bool-pref: "userChrome.tabbar.as_titlebar")) { - .tabbrowser-tab[pinned] .tab-content::before { + .tabbrowser-tab[pinned] .tab-content::before, + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-content::before { transform: translateY(var(--uc-container-position-y)); - width: 16px; + width: 16px !important; } } @media (-moz-bool-pref: "userChrome.tab.container") and (not (-moz-bool-pref: "userChrome.tabbar.as_titlebar")) and (-moz-bool-pref: "userChrome.tab.close_button_at_pinned") { - .tabbrowser-tab[pinned][visuallyselected]:not([busy]):hover .tab-content::before { + .tabbrowser-tab[pinned][visuallyselected]:not([busy]):hover .tab-content::before, + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[visuallyselected]:not([busy]):hover + .tab-content::before { opacity: 0; } } @media (-moz-bool-pref: "userChrome.tab.container") and (not (-moz-bool-pref: "userChrome.tabbar.as_titlebar")) and (not (-moz-bool-pref: "userChrome.tab.container.on_top")) { .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected])::before, - .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected])::before { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image][usercontextid] + > .tab-stack + > .tab-content[attention]:not([selected])::before, + .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected])::before, + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[usercontextid] + > .tab-stack + > .tab-content[titlechanged]:not([selected])::before { opacity: 0; } /* Pinned Tab - Titlechanged Indicator override */ .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected]), - .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]) { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image][usercontextid] + > .tab-stack + > .tab-content[attention]:not([selected]), + .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[usercontextid] + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { /* Original: radial-gradient(circle, var(--attention-icon-color), var(--attention-icon-color) 2px, transparent 2px); */ --dotted-identity-image: radial-gradient( circle, @@ -24551,7 +24643,15 @@ background-position-x: var(--uc-titlechanged-container-position-x) !important; } .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected]), - .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]) { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image] + > .tab-stack + > .tab-content[attention]:not([selected]), + .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */ background-position-y: top var(--uc-container-position-y) !important; } @@ -24559,25 +24659,51 @@ .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image][usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[attention]:not([selected]), .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack - > .tab-content[pinned][titlechanged]:not([selected]) { + > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { --uc-titlechanged-container-position-x: calc(32% - 1px), calc(50% - 1px), calc(70% - 1px); } :root[uidensity="compact"] .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected]), + :root[uidensity="compact"] + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image][usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[attention]:not([selected]), :root[uidensity="compact"] .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack - > .tab-content[pinned][titlechanged]:not([selected]) { + > .tab-content[pinned][titlechanged]:not([selected]), + :root[uidensity="compact"] + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { --uc-titlechanged-container-position-x: calc(30% - 1px), calc(50% - 1px), calc(70% - 1px); } } @media (-moz-bool-pref: "userChrome.tab.container") and (not (-moz-bool-pref: "userChrome.tabbar.as_titlebar")) and (-moz-bool-pref: "userChrome.tab.container.on_top") { .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected]), - .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]) { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image] + > .tab-stack + > .tab-content[attention]:not([selected]), + .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */ background-position-y: top var(--uc-container-position-y-bottom) !important; } diff --git a/css/leptonChromeESR.css b/css/leptonChromeESR.css index fce8c4d..8821e9c 100644 --- a/css/leptonChromeESR.css +++ b/css/leptonChromeESR.css @@ -7755,13 +7755,22 @@ box-shadow: unset !important; filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); } - #tabbrowser-tabs:not([noshadowfortests])[expanded][orient="horizontal"] + #tabbrowser-tabs:not([noshadowfortests])[orient="vertical"] .tab-background:is([selected], [multiselected]) .tab-group-line { - height: calc(100% + 5px + var(--tab-block-margin)); - left: calc(-1 * var(--tab-inner-inline-margin)); + height: calc(100% + 6px + var(--tab-block-margin)); transform: translateY(-2px); } + #tabbrowser-tabs:not([noshadowfortests])[expanded][orient="vertical"] + .tab-background:is([selected], [multiselected]) + .tab-group-line { + inset-inline-start: calc(-1 * var(--tab-inner-inline-margin)) !important; + } + #tabbrowser-tabs:not([noshadowfortests]):not([expanded])[orient="vertical"] + .tab-background:is([selected], [multiselected]) + .tab-group-line { + inset-inline-start: calc(-1 * var(--tab-inner-inline-margin) + 2px) !important; + } #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { box-shadow: unset !important; filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.4)); @@ -9552,12 +9561,16 @@ } } /* Pinned Tab */ - .tabbrowser-tab[pinned] .tab-content::before { + .tabbrowser-tab[pinned] .tab-content::before, + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-content::before { transform: translateY(var(--uc-container-position-y)); - width: 16px; + width: 16px !important; } @supports -moz-bool-pref("userChrome.tab.close_button_at_pinned") { - .tabbrowser-tab[pinned][visuallyselected]:not([busy]):hover .tab-content::before { + .tabbrowser-tab[pinned][visuallyselected]:not([busy]):hover .tab-content::before, + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[visuallyselected]:not([busy]):hover + .tab-content::before { opacity: 0; } } @@ -9565,12 +9578,28 @@ .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected])::before, - .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected])::before { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image][usercontextid] + > .tab-stack + > .tab-content[attention]:not([selected])::before, + .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected])::before, + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[usercontextid] + > .tab-stack + > .tab-content[titlechanged]:not([selected])::before { opacity: 0; } /* Pinned Tab - Titlechanged Indicator override */ .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected]), - .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]) { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image][usercontextid] + > .tab-stack + > .tab-content[attention]:not([selected]), + .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[usercontextid] + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { /* Original: radial-gradient(circle, var(--attention-icon-color), var(--attention-icon-color) 2px, transparent 2px); */ --dotted-identity-image: radial-gradient( circle, @@ -9582,7 +9611,15 @@ background-position-x: var(--uc-titlechanged-container-position-x) !important; } .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected]), - .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]) { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image] + > .tab-stack + > .tab-content[attention]:not([selected]), + .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */ background-position-y: top var(--uc-container-position-y) !important; } @@ -9590,25 +9627,51 @@ .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image][usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[attention]:not([selected]), .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack - > .tab-content[pinned][titlechanged]:not([selected]) { + > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { --uc-titlechanged-container-position-x: calc(32% - 1px), calc(50% - 1px), calc(70% - 1px); } :root[uidensity="compact"] .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected]), + :root[uidensity="compact"] + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image][usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[attention]:not([selected]), :root[uidensity="compact"] .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack - > .tab-content[pinned][titlechanged]:not([selected]) { + > .tab-content[pinned][titlechanged]:not([selected]), + :root[uidensity="compact"] + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { --uc-titlechanged-container-position-x: calc(30% - 1px), calc(50% - 1px), calc(70% - 1px); } } @supports -moz-bool-pref("userChrome.tab.container.on_top") { .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected]), - .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]) { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab[image] + > .tab-stack + > .tab-content[attention]:not([selected]), + .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) + .tabbrowser-tab + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */ background-position-y: top var(--uc-container-position-y-bottom) !important; } diff --git a/src/tab/_container_tab.scss b/src/tab/_container_tab.scss index 3043e3e..4f132eb 100644 --- a/src/tab/_container_tab.scss +++ b/src/tab/_container_tab.scss @@ -68,12 +68,15 @@ } /* Pinned Tab */ -.tabbrowser-tab[pinned] .tab-content::before { +.tabbrowser-tab[pinned] .tab-content::before, +#tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-content::before { + left: unset; transform: translateY(var(--uc-container-position-y)); - width: 16px; + width: 16px !important; } @include Option("userChrome.tab.close_button_at_pinned") { - .tabbrowser-tab[pinned][visuallyselected]:not([busy]):hover .tab-content::before { + .tabbrowser-tab[pinned][visuallyselected]:not([busy]):hover .tab-content::before, + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab[visuallyselected]:not([busy]):hover .tab-content::before { opacity: 0; } // Don't hide at userChrome.tab.close_button_at_pinned.background @@ -81,13 +84,17 @@ @include NotOption("userChrome.tab.container.on_top") { .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected])::before, - .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected])::before { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab[image][usercontextid] > .tab-stack > .tab-content[attention]:not([selected])::before, + .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected])::before, + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[titlechanged]:not([selected])::before { opacity: 0; } /* Pinned Tab - Titlechanged Indicator override */ .tabbrowser-tab:is([image], [pinned])[usercontextid] > .tab-stack > .tab-content[attention]:not([selected]), - .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]) { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab[image][usercontextid] > .tab-stack > .tab-content[attention]:not([selected]), + .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab[usercontextid] > .tab-stack > .tab-content[titlechanged]:not([selected]) { /* Original: radial-gradient(circle, var(--attention-icon-color), var(--attention-icon-color) 2px, transparent 2px); */ --dotted-identity-image: radial-gradient( circle, @@ -100,7 +107,9 @@ } .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected]), - .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]) { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab[image] > .tab-stack > .tab-content[attention]:not([selected]), + .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab > .tab-stack > .tab-content[titlechanged]:not([selected]) { /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */ background-position-y: top var(--uc-container-position-y) !important; } @@ -109,26 +118,42 @@ .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab[image][usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[attention]:not([selected]), .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack - > .tab-content[pinned][titlechanged]:not([selected]) { + > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { --uc-titlechanged-container-position-x: calc(32% - 1px), calc(50% - 1px), calc(70% - 1px); } :root[uidensity="compact"] .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[attention]:not([selected]), + :root[uidensity="compact"] + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab[image][usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[attention]:not([selected]), :root[uidensity="compact"] .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack - > .tab-content[pinned][titlechanged]:not([selected]) { + > .tab-content[pinned][titlechanged]:not([selected]), + :root[uidensity="compact"] + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) + > .tab-stack + > .tab-content[titlechanged]:not([selected]) { --uc-titlechanged-container-position-x: calc(30% - 1px), calc(50% - 1px), calc(70% - 1px); } } @include Option("userChrome.tab.container.on_top") { .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected]), - .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]) { + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab[image] > .tab-stack > .tab-content[attention]:not([selected]), + .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected]), + #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tabbrowser-tab > .tab-stack > .tab-content[titlechanged]:not([selected]) { /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */ background-position-y: top var(--uc-container-position-y-bottom) !important; } diff --git a/src/tab/selected_tab/_box_shadow.scss b/src/tab/selected_tab/_box_shadow.scss index c9be03b..fb9b3b0 100644 --- a/src/tab/selected_tab/_box_shadow.scss +++ b/src/tab/selected_tab/_box_shadow.scss @@ -19,11 +19,16 @@ $ucTabBackgroundShadowHard: drop-shadow(-1px 0px 0px var(--uc-tab-shadow-color, } /* filter create new stacking context */ - &[expanded][orient="vertical"] .tab-background:is([selected], [multiselected]) .tab-group-line { + &[orient="vertical"] .tab-background:is([selected], [multiselected]) .tab-group-line { height: calc(100% + 6px + var(--tab-block-margin)); // 6px: .tab-group-line's inset-block size - left: calc(-1 * var(--tab-inner-inline-margin)); transform: translateY(-2px); // .tab-group-line 's inset-inline-start size } + &[expanded][orient="vertical"] .tab-background:is([selected], [multiselected]) .tab-group-line { + inset-inline-start: calc(-1 * var(--tab-inner-inline-margin)) !important; + } + &:not([expanded])[orient="vertical"] .tab-background:is([selected], [multiselected]) .tab-group-line { + inset-inline-start: calc(-1 * var(--tab-inner-inline-margin) + 2px) !important; + } } #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { box-shadow: unset !important; From a14d22599ae6dab6559e40ff2e41495defe4686c Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Tue, 23 Dec 2025 00:00:00 +0900 Subject: [PATCH 09/12] Fix: URL Bar - When vertical tabbar #1095 --- css/leptonChrome.css | 11 +++++++---- css/leptonChromeESR.css | 4 +++- src/padding/_index.scss | 3 ++- 3 files changed, 12 insertions(+), 6 deletions(-) diff --git a/css/leptonChrome.css b/css/leptonChrome.css index 70fd890..4cbc056 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -4622,7 +4622,8 @@ } } @media -moz-pref("userChrome.padding.urlView_expanding") or -moz-pref("userChrome.urlView.as_commandbar") { - #urlbar[breakout][breakout-extend] { + /* .browser-titlebar is Vertical Tabbar */ + #nav-bar:not(.browser-titlebar) #urlbar[breakout][breakout-extend] { top: calc(var(--urlbar-container-height) * 2 - var(--urlbar-height)) !important; width: var(--urlbar-width) !important; position: relative !important; @@ -4891,8 +4892,7 @@ padding: unset !important; padding-top: 4px !important; } -} -/*= Popup Panel - Reduce padding =============================================*/ +} /*= Popup Panel - Reduce padding =============================================*/ @media -moz-pref("userChrome.padding.popup_panel") { #protections-popup-main-header-label { height: unset !important; /* Original: 37.6px */ @@ -9104,6 +9104,7 @@ /* Pinned Tab */ .tabbrowser-tab[pinned] .tab-content::before, #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-content::before { + left: unset; transform: translateY(var(--uc-container-position-y)); width: 16px !important; } @@ -19483,7 +19484,8 @@ } } @media (-moz-bool-pref: "userChrome.padding.urlView_expanding"), (-moz-bool-pref: "userChrome.urlView.as_commandbar") { - #urlbar[breakout][breakout-extend] { + /* .browser-titlebar is Vertical Tabbar */ + #nav-bar:not(.browser-titlebar) #urlbar[breakout][breakout-extend] { top: calc(var(--urlbar-container-height) * 2 - var(--urlbar-height)) !important; width: var(--urlbar-width) !important; position: relative !important; @@ -24596,6 +24598,7 @@ @media (-moz-bool-pref: "userChrome.tab.container") and (not (-moz-bool-pref: "userChrome.tabbar.as_titlebar")) { .tabbrowser-tab[pinned] .tab-content::before, #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-content::before { + left: unset; transform: translateY(var(--uc-container-position-y)); width: 16px !important; } diff --git a/css/leptonChromeESR.css b/css/leptonChromeESR.css index 8821e9c..4d03477 100644 --- a/css/leptonChromeESR.css +++ b/css/leptonChromeESR.css @@ -4968,7 +4968,8 @@ } } @supports -moz-bool-pref("userChrome.padding.urlView_expanding") or -moz-bool-pref("userChrome.urlView.as_commandbar") { - #urlbar[breakout][breakout-extend] { + /* .browser-titlebar is Vertical Tabbar */ + #nav-bar:not(.browser-titlebar) #urlbar[breakout][breakout-extend] { top: calc(var(--urlbar-container-height) * 2 - var(--urlbar-height)) !important; width: var(--urlbar-width) !important; position: relative !important; @@ -9563,6 +9564,7 @@ /* Pinned Tab */ .tabbrowser-tab[pinned] .tab-content::before, #tabbrowser-tabs[orient="vertical"]:not([expanded]) .tab-content::before { + left: unset; transform: translateY(var(--uc-container-position-y)); width: 16px !important; } diff --git a/src/padding/_index.scss b/src/padding/_index.scss index 32328f1..4b73926 100644 --- a/src/padding/_index.scss +++ b/src/padding/_index.scss @@ -50,7 +50,8 @@ } } @include Option("userChrome.padding.urlView_expanding", "userChrome.urlView.as_commandbar") { - #urlbar[breakout][breakout-extend] { + /* .browser-titlebar is Vertical Tabbar */ + #nav-bar:not(.browser-titlebar) #urlbar[breakout][breakout-extend] { top: calc(var(--urlbar-container-height) * 2 - var(--urlbar-height)) !important; width: var(--urlbar-width) !important; position: relative !important; From 86b8fc319fea8895a6119a829a261825760875c1 Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Wed, 24 Dec 2025 00:00:00 +0900 Subject: [PATCH 10/12] Docs: Update CREDIT --- CREDITS | 3 +++ README.org | 1 + 2 files changed, 4 insertions(+) diff --git a/CREDITS b/CREDITS index d7b8fbf..eef7fb7 100644 --- a/CREDITS +++ b/CREDITS @@ -71,6 +71,9 @@ W: https://github.com/engelju N: kanlukasz W: https://github.com/kanlukasz +N: Kevin Ernst +W: https://github.com/ernstki + N: Mike-Kennelly W: https://github.com/Mike-Kennelly diff --git a/README.org b/README.org index 5c6029a..ded4ef0 100644 --- a/README.org +++ b/README.org @@ -220,6 +220,7 @@ Thanks to all sponsors & contributors to this project for providing help and dev - [[https://ko-fi.com/home/coffeeshop?txid=97e5fa0d-c73e-4308-a2fd-6b44b08cd828][Safira]] - [[https://ko-fi.com/duncanyoyo1][duncanyoyo1]] - [[https://ko-fi.com/home/coffeeshop?txid=a84c4838-f0e8-45b4-8b61-46684697e9b2][Minithra]] + - [[https://github.com/black7375/Firefox-UI-Fix/issues/1095#issuecomment-3682151859][Kevin Ernst]] - Private sponsors: 5 *Contributors* From 6f962561f71645253607d7f723915d8906924f26 Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Thu, 25 Dec 2025 00:00:00 +0900 Subject: [PATCH 11/12] Test: update testcode --- __tests__/theme.test.scss | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/__tests__/theme.test.scss b/__tests__/theme.test.scss index 329a6d2..81ed02f 100644 --- a/__tests__/theme.test.scss +++ b/__tests__/theme.test.scss @@ -59,7 +59,7 @@ } } @include expect { - :root[lwtheme-mozlightdark], :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);"]) { + :root[lwtheme-mozlightdark], :root:is(:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [builtintheme][devtoolstheme=light]), :is([style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], [builtintheme][devtoolstheme=dark])) { @include example_property; } } @@ -74,7 +74,7 @@ } } @include expect { - :root[lwtheme-mozlightdark][inFullscreen=true], :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);"])[inFullscreen=true] { + :root[lwtheme-mozlightdark][inFullscreen=true], :root:is(:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [builtintheme][devtoolstheme=light]), :is([style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], [builtintheme][devtoolstheme=dark]))[inFullscreen=true] { @include example_property; } } @@ -89,7 +89,7 @@ } } @include expect { - :root[lwtheme-mozlightdark] #navigator-toolbox, :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);"]) #navigator-toolbox { + :root[lwtheme-mozlightdark] #navigator-toolbox, :root:is(:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [builtintheme][devtoolstheme=light]), :is([style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], [builtintheme][devtoolstheme=dark])) #navigator-toolbox { @include example_property; } } @@ -106,7 +106,7 @@ } } @include expect { - :root[lwtheme-mozlightdark]:not([lwthemetextcolor=bright]), :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] { + :root[lwtheme-mozlightdark]:not([lwthemetextcolor=bright]), :root:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [builtintheme][devtoolstheme=light]) { @include example_property; } } @@ -121,7 +121,7 @@ } } @include expect { - :root[lwtheme-mozlightdark]:not([lwthemetextcolor=bright])[inFullscreen=true], :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"][inFullscreen=true] { + :root[lwtheme-mozlightdark]:not([lwthemetextcolor=bright])[inFullscreen=true], :root:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [builtintheme][devtoolstheme=light])[inFullscreen=true] { @include example_property; } } @@ -136,7 +136,7 @@ } } @include expect { - :root[lwtheme-mozlightdark]:not([lwthemetextcolor=bright]) #navigator-toolbox, :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] #navigator-toolbox { + :root[lwtheme-mozlightdark]:not([lwthemetextcolor=bright]) #navigator-toolbox, :root:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [builtintheme][devtoolstheme=light]) #navigator-toolbox { @include example_property; } } @@ -153,7 +153,7 @@ } } @include expect { - :root[lwtheme-mozlightdark][lwthemetextcolor=bright], :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] { + :root[lwtheme-mozlightdark][lwthemetextcolor=bright], :root:is([style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], [builtintheme][devtoolstheme=dark]) { @include example_property; } } @@ -168,7 +168,7 @@ } } @include expect { - :root[lwtheme-mozlightdark][lwthemetextcolor=bright][inFullscreen=true], :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"][inFullscreen=true] { + :root[lwtheme-mozlightdark][lwthemetextcolor=bright][inFullscreen=true], :root:is([style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], [builtintheme][devtoolstheme=dark])[inFullscreen=true] { @include example_property; } } @@ -183,7 +183,7 @@ } } @include expect { - :root[lwtheme-mozlightdark][lwthemetextcolor=bright] #navigator-toolbox, :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] #navigator-toolbox { + :root[lwtheme-mozlightdark][lwthemetextcolor=bright] #navigator-toolbox, :root:is([style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"], [builtintheme][devtoolstheme=dark]) #navigator-toolbox { @include example_property; } } From 1f30fe71dd5afd80cb803753eedef50f71dee9a5 Mon Sep 17 00:00:00 2001 From: alstjr7375 Date: Fri, 2 Jan 2026 01:20:44 +0900 Subject: [PATCH 12/12] docs: CREDITS update --- CREDITS | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/CREDITS b/CREDITS index eef7fb7..2d7b29d 100644 --- a/CREDITS +++ b/CREDITS @@ -152,6 +152,9 @@ N: Filip Š E: filip.stamcar@hotmail.com W: https://www.filips.si/ +N: hdk5 +W: https://github.com/hdk5 + N: hellojaccc E: kim@taekyeong.me W: https://github.com/hellojaccc @@ -228,6 +231,9 @@ N: sean z E: ean@vsxd.com W: https://vsxd.com/ +N: Seth Kinast +W: https://github.com/sethkinast + N: Sylvain E: B00ze64@hotmail.com W: https://github.com/B00ze64