diff --git a/css/leptonChrome.css b/css/leptonChrome.css index 19fa660..6b22b66 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -183,14 +183,18 @@ align-items: center !important; } /*= Inactive transparent #882 ================================================*/ - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity, 0.75) * 100%), transparent) !important; --inactive-toolbarbutton-icon-fill-opacity: calc( var(--toolbarbutton-icon-fill-opacity, 1) * var(--inactive-titlebar-opacity, 0.75) ); } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .toolbarbutton-icon { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .toolbarbutton-icon, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .toolbarbutton-icon, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .toolbarbutton-icon { fill-opacity: var(--inactive-toolbarbutton-icon-fill-opacity, 1); } /*= Tabpreviw transparent #890 ===============================================*/ @@ -660,7 +664,11 @@ } @media (-moz-platform: windows) { :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #titlebar, - :root[lwt-default-theme-in-dark-mode] #titlebar { + :root[lwt-default-theme-in-dark-mode] #titlebar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #toolbar-menubar, + :root[lwt-default-theme-in-dark-mode] #toolbar-menubar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #TabsToolbar, + :root[lwt-default-theme-in-dark-mode] #TabsToolbar { --button-hover-bgcolor: var(--win-sidebar-button-hover-bgcolor); --button-active-bgcolor: var(--win-sidebar-button-hover-active-bgcolor); --toolbarbutton-hover-background: var(--win-sidebar-button-hover-bgcolor); @@ -1006,11 +1014,17 @@ :root[lwt-default-theme-in-dark-mode] #navigator-toolbox { background-color: var(--mac-bgcolor) !important; } - :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #titlebar { + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #titlebar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #toolbar-menubar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #TabsToolbar { --mac-hover-bgcolor: ButtonFace; } :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #titlebar, - :root[lwt-default-theme-in-dark-mode] #titlebar { + :root[lwt-default-theme-in-dark-mode] #titlebar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #toolbar-menubar, + :root[lwt-default-theme-in-dark-mode] #toolbar-menubar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #TabsToolbar, + :root[lwt-default-theme-in-dark-mode] #TabsToolbar { --button-hover-bgcolor: var(--mac-hover-bgcolor); --button-active-bgcolor: var(--mac-hover-bgcolor); --toolbarbutton-hover-background: var(--mac-hover-bgcolor); @@ -2273,13 +2287,17 @@ :root[style*="--focus-outline-color: rgb(172, 112, 255); --panel-separator-zap-gradient: linear-gradient(90deg, #9059FF 0%, #FF4AA2 52.08%, #FFBD4F 100%);"] { --lwt-accent-color: rgb(45, 36, 91) !important; } - #titlebar { + #titlebar, + #toolbar-menubar, + #TabsToolbar { --uc-frame-element-background: color-mix(in srgb, var(--lwt-accent-color, Window) 60%, transparent); --toolbarbutton-hover-background: color-mix(in srgb, var(--lwt-accent-color, Window) 85%, transparent); } } @media (-moz-gtk-csd-available) and (prefers-color-scheme: dark) { - #titlebar { + #titlebar, + #toolbar-menubar, + #TabsToolbar { --toolbarbutton-hover-background: color-mix( in srgb, var(--lwt-accent-color, Window) 40%, @@ -2329,7 +2347,9 @@ --lwt-accent-color: transparent !important; --lwt-text-color: WindowText !important; } - #titlebar .toolbarbutton-1 { + #titlebar .toolbarbutton-1, + #toolbar-menubar .toolbarbutton-1, + #TabsToolbar .toolbarbutton-1 { --toolbarbutton-icon-fill: var(--lwt-text-color) !important; } :root:not([sizemode="fullscreen"]) .titlebar-buttonbox-container .titlebar-button:not(.titlebar-close:hover) { @@ -4765,6 +4785,8 @@ display: flex !important; /* Needed for content to take up entire height, compatibility with tabs on bottom */ } :root[sizemode="fullscreen"] #titlebar, + :root[sizemode="fullscreen"] #toolbar-menubar, + :root[sizemode="fullscreen"] #TabsToolbar, :root[sizemode="fullscreen"] #nav-bar, :root[sizemode="fullscreen"] #PersonalToolbar, :root[sizemode="fullscreen"] #tab-notification-deck, @@ -4781,7 +4803,8 @@ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /*= Tabbar - Move to bottom ==================================================*/ - #titlebar { + #titlebar, + #TabsToolbar { order: 2; -moz-box-ordinal-group: 2; --tabs-navbar-shadow-size: 0px; @@ -4893,7 +4916,8 @@ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /*= Tabbar - Move to bottom ==================================================*/ - #titlebar { + #titlebar, + #TabsToolbar { order: 2; -moz-box-ordinal-group: 2; --tabs-navbar-shadow-size: 0px; @@ -5023,7 +5047,9 @@ margin-top: calc(var(--uc-tabbar-hide-height) + var(--uc-navbar-double-block)) !important; margin-bottom: var(--uc-navbar-block, 0px) !important; } - #titlebar { + #titlebar, + #toolbar-menubar, + #TabsToolbar { transform: translateY(var(--uc-navbar-block, 0px)); } #TabsToolbar > .titlebar-buttonbox-container { @@ -5125,7 +5151,9 @@ margin-top: calc(var(--uc-tabbar-hide-height) + var(--uc-navbar-double-block)) !important; margin-bottom: var(--uc-navbar-block, 0px) !important; } - #titlebar { + #titlebar, + #toolbar-menubar, + #TabsToolbar { transform: translateY(var(--uc-navbar-block, 0px)); } #TabsToolbar > .titlebar-buttonbox-container { @@ -5502,13 +5530,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -5655,13 +5689,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -5805,13 +5845,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -5973,13 +6019,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -6130,13 +6182,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -6282,13 +6340,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -9868,7 +9932,7 @@ margin-top: 0 !important; } :root[sizemode="fullscreen"]:not([inDOMFullscreen="true"]) - :-moz-any(#navigator-toolbox, #titlebar, #nav-bar, #PersonalToolbar) { + :-moz-any(#navigator-toolbox, #titlebar, #toolbar-menubar, #TabsToolbar, #nav-bar, #PersonalToolbar) { width: 100%; /* Makes the UI take up the entire width */ } :root[sizemode="fullscreen"]:not([inDOMFullscreen="true"]) #urlbar:popover-open { @@ -10330,7 +10394,8 @@ @supports -moz-bool-pref("userChrome.autohide.tabbar") or -moz-bool-pref("userChrome.autohide.navbar") { @supports -moz-bool-pref("userChrome.autohide.tabbar") or -moz-bool-pref("userChrome.tabbar.one_liner") { @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { - :root:not([customizing]) #titlebar { + :root:not([customizing]) #titlebar, + :root:not([customizing]) #navigator-toolbox > #TabsToolbar { margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } @@ -10348,7 +10413,8 @@ opacity: 0; } } - #navigator-toolbox:is(:hover, :focus-within) > #titlebar { + #navigator-toolbox:is(:hover, :focus-within) > #titlebar, + #navigator-toolbox:is(:hover, :focus-within) > #TabsToolbar { margin-bottom: 0px; } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { @@ -10365,7 +10431,8 @@ } @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { @media screen and (min-width: 1100px) { - :root:not([customizing]) #titlebar { + :root:not([customizing]) #titlebar, + :root:not([customizing]) #navigator-toolbox > #TabsToolbar { margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } @@ -10383,7 +10450,8 @@ opacity: 0; } } - #navigator-toolbox:is(:hover, :focus-within) > #titlebar { + #navigator-toolbox:is(:hover, :focus-within) > #titlebar, + #navigator-toolbox:is(:hover, :focus-within) > #TabsToolbar { margin-bottom: 0px; } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { @@ -10399,7 +10467,8 @@ } } @supports -moz-bool-pref("userChrome.autohide.tabbar") { - :root:not([customizing]) #titlebar { + :root:not([customizing]) #titlebar, + :root:not([customizing]) #navigator-toolbox > #TabsToolbar { margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } @@ -10417,7 +10486,8 @@ opacity: 0; } } - #navigator-toolbox:is(:hover, :focus-within) > #titlebar { + #navigator-toolbox:is(:hover, :focus-within) > #titlebar, + #navigator-toolbox:is(:hover, :focus-within) > #TabsToolbar { margin-bottom: 0px; } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { @@ -14115,14 +14185,18 @@ } } @media (-moz-bool-pref: "userChrome.compatibility.theme") { - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity, 0.75) * 100%), transparent) !important; --inactive-toolbarbutton-icon-fill-opacity: calc( var(--toolbarbutton-icon-fill-opacity, 1) * var(--inactive-titlebar-opacity, 0.75) ); } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .toolbarbutton-icon { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .toolbarbutton-icon, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .toolbarbutton-icon, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .toolbarbutton-icon { fill-opacity: var(--inactive-toolbarbutton-icon-fill-opacity, 1); } } @@ -14584,7 +14658,11 @@ } @media (-moz-bool-pref: "userChrome.theme.system_default") and (-moz-platform: windows) { :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #titlebar, - :root[lwt-default-theme-in-dark-mode] #titlebar { + :root[lwt-default-theme-in-dark-mode] #titlebar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #toolbar-menubar, + :root[lwt-default-theme-in-dark-mode] #toolbar-menubar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #TabsToolbar, + :root[lwt-default-theme-in-dark-mode] #TabsToolbar { --button-hover-bgcolor: var(--win-sidebar-button-hover-bgcolor); --button-active-bgcolor: var(--win-sidebar-button-hover-active-bgcolor); --toolbarbutton-hover-background: var(--win-sidebar-button-hover-bgcolor); @@ -14935,13 +15013,19 @@ } } @media (-moz-bool-pref: "userChrome.theme.system_default") and (-moz-bool-pref: "layout.css.osx-font-smoothing.enabled") { - :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #titlebar { + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #titlebar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #toolbar-menubar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #TabsToolbar { --mac-hover-bgcolor: ButtonFace; } } @media (-moz-bool-pref: "userChrome.theme.system_default") and (-moz-bool-pref: "layout.css.osx-font-smoothing.enabled") { :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #titlebar, - :root[lwt-default-theme-in-dark-mode] #titlebar { + :root[lwt-default-theme-in-dark-mode] #titlebar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #toolbar-menubar, + :root[lwt-default-theme-in-dark-mode] #toolbar-menubar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #TabsToolbar, + :root[lwt-default-theme-in-dark-mode] #TabsToolbar { --button-hover-bgcolor: var(--mac-hover-bgcolor); --button-active-bgcolor: var(--mac-hover-bgcolor); --toolbarbutton-hover-background: var(--mac-hover-bgcolor); @@ -16245,13 +16329,17 @@ :root[style*="--focus-outline-color: rgb(172, 112, 255); --panel-separator-zap-gradient: linear-gradient(90deg, #9059FF 0%, #FF4AA2 52.08%, #FFBD4F 100%);"] { --lwt-accent-color: rgb(45, 36, 91) !important; } - #titlebar { + #titlebar, + #toolbar-menubar, + #TabsToolbar { --uc-frame-element-background: color-mix(in srgb, var(--lwt-accent-color, Window) 60%, transparent); --toolbarbutton-hover-background: color-mix(in srgb, var(--lwt-accent-color, Window) 85%, transparent); } } @media (-moz-bool-pref: "userChrome.theme.transparent.frame") and (-moz-gtk-csd-available) and (prefers-color-scheme: dark) { - #titlebar { + #titlebar, + #toolbar-menubar, + #TabsToolbar { --toolbarbutton-hover-background: color-mix( in srgb, var(--lwt-accent-color, Window) 40%, @@ -16301,7 +16389,9 @@ --lwt-accent-color: transparent !important; --lwt-text-color: WindowText !important; } - #titlebar .toolbarbutton-1 { + #titlebar .toolbarbutton-1, + #toolbar-menubar .toolbarbutton-1, + #TabsToolbar .toolbarbutton-1 { --toolbarbutton-icon-fill: var(--lwt-text-color) !important; } :root:not([sizemode="fullscreen"]) .titlebar-buttonbox-container .titlebar-button:not(.titlebar-close:hover) { @@ -18864,6 +18954,8 @@ display: flex !important; /* Needed for content to take up entire height, compatibility with tabs on bottom */ } :root[sizemode="fullscreen"] #titlebar, + :root[sizemode="fullscreen"] #toolbar-menubar, + :root[sizemode="fullscreen"] #TabsToolbar, :root[sizemode="fullscreen"] #nav-bar, :root[sizemode="fullscreen"] #PersonalToolbar, :root[sizemode="fullscreen"] #tab-notification-deck, @@ -18879,7 +18971,8 @@ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /*= Tabbar - Move to bottom ==================================================*/ - #titlebar { + #titlebar, + #TabsToolbar { order: 2; -moz-box-ordinal-group: 2; --tabs-navbar-shadow-size: 0px; @@ -18985,7 +19078,8 @@ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /*= Tabbar - Move to bottom ==================================================*/ - #titlebar { + #titlebar, + #TabsToolbar { order: 2; -moz-box-ordinal-group: 2; --tabs-navbar-shadow-size: 0px; @@ -19111,7 +19205,9 @@ } } @media (-moz-bool-pref: "userChrome.tabbar.one_liner") and (not (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive")) { - #titlebar { + #titlebar, + #toolbar-menubar, + #TabsToolbar { transform: translateY(var(--uc-navbar-block, 0px)); } } @@ -19228,7 +19324,9 @@ } } @media screen and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (min-width: 1100px) { - #titlebar { + #titlebar, + #toolbar-menubar, + #TabsToolbar { transform: translateY(var(--uc-navbar-block, 0px)); } } @@ -19770,13 +19868,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -19970,13 +20074,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -20164,13 +20274,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -20412,13 +20528,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -20612,13 +20734,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -20806,13 +20934,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -24644,7 +24778,7 @@ margin-top: 0 !important; } :root[sizemode="fullscreen"]:not([inDOMFullscreen="true"]) - :-moz-any(#navigator-toolbox, #titlebar, #nav-bar, #PersonalToolbar) { + :-moz-any(#navigator-toolbox, #titlebar, #toolbar-menubar, #TabsToolbar, #nav-bar, #PersonalToolbar) { width: 100%; /* Makes the UI take up the entire width */ } :root[sizemode="fullscreen"]:not([inDOMFullscreen="true"]) #urlbar:popover-open { @@ -25236,7 +25370,8 @@ (-moz-bool-pref: "userChrome.autohide.tabbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (not (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive")), (-moz-bool-pref: "userChrome.autohide.navbar") and (-moz-bool-pref: "userChrome.autohide.tabbar") and (not (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive")), (-moz-bool-pref: "userChrome.autohide.navbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (not (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive")) { - :root:not([customizing]) #titlebar { + :root:not([customizing]) #titlebar, + :root:not([customizing]) #navigator-toolbox > #TabsToolbar { margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } @@ -25265,7 +25400,8 @@ (-moz-bool-pref: "userChrome.autohide.tabbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (not (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive")), (-moz-bool-pref: "userChrome.autohide.navbar") and (-moz-bool-pref: "userChrome.autohide.tabbar") and (not (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive")), (-moz-bool-pref: "userChrome.autohide.navbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (not (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive")) { - #navigator-toolbox:is(:hover, :focus-within) > #titlebar { + #navigator-toolbox:is(:hover, :focus-within) > #titlebar, + #navigator-toolbox:is(:hover, :focus-within) > #TabsToolbar { margin-bottom: 0px; } } @@ -25290,7 +25426,8 @@ screen and (-moz-bool-pref: "userChrome.autohide.tabbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (min-width: 1100px), screen and (-moz-bool-pref: "userChrome.autohide.navbar") and (-moz-bool-pref: "userChrome.autohide.tabbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (min-width: 1100px), screen and (-moz-bool-pref: "userChrome.autohide.navbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (min-width: 1100px) { - :root:not([customizing]) #titlebar { + :root:not([customizing]) #titlebar, + :root:not([customizing]) #navigator-toolbox > #TabsToolbar { margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } @@ -25319,7 +25456,8 @@ screen and (-moz-bool-pref: "userChrome.autohide.tabbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (min-width: 1100px), screen and (-moz-bool-pref: "userChrome.autohide.navbar") and (-moz-bool-pref: "userChrome.autohide.tabbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (min-width: 1100px), screen and (-moz-bool-pref: "userChrome.autohide.navbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (min-width: 1100px) { - #navigator-toolbox:is(:hover, :focus-within) > #titlebar { + #navigator-toolbox:is(:hover, :focus-within) > #titlebar, + #navigator-toolbox:is(:hover, :focus-within) > #TabsToolbar { margin-bottom: 0px; } } @@ -25344,7 +25482,8 @@ (-moz-bool-pref: "userChrome.autohide.tabbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (-moz-bool-pref: "userChrome.autohide.tabbar"), (-moz-bool-pref: "userChrome.autohide.navbar") and (-moz-bool-pref: "userChrome.autohide.tabbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (-moz-bool-pref: "userChrome.autohide.tabbar"), (-moz-bool-pref: "userChrome.autohide.navbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (-moz-bool-pref: "userChrome.autohide.tabbar") { - :root:not([customizing]) #titlebar { + :root:not([customizing]) #titlebar, + :root:not([customizing]) #navigator-toolbox > #TabsToolbar { margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } @@ -25373,7 +25512,8 @@ (-moz-bool-pref: "userChrome.autohide.tabbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (-moz-bool-pref: "userChrome.autohide.tabbar"), (-moz-bool-pref: "userChrome.autohide.navbar") and (-moz-bool-pref: "userChrome.autohide.tabbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (-moz-bool-pref: "userChrome.autohide.tabbar"), (-moz-bool-pref: "userChrome.autohide.navbar") and (-moz-bool-pref: "userChrome.tabbar.one_liner") and (-moz-bool-pref: "userChrome.tabbar.one_liner.responsive") and (-moz-bool-pref: "userChrome.autohide.tabbar") { - #navigator-toolbox:is(:hover, :focus-within) > #titlebar { + #navigator-toolbox:is(:hover, :focus-within) > #titlebar, + #navigator-toolbox:is(:hover, :focus-within) > #TabsToolbar { margin-bottom: 0px; } } diff --git a/css/leptonChromeESR.css b/css/leptonChromeESR.css index 0b71cfd..49e93b2 100644 --- a/css/leptonChromeESR.css +++ b/css/leptonChromeESR.css @@ -183,14 +183,18 @@ align-items: center !important; } /*= Inactive transparent #882 ================================================*/ - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity, 0.75) * 100%), transparent) !important; --inactive-toolbarbutton-icon-fill-opacity: calc( var(--toolbarbutton-icon-fill-opacity, 1) * var(--inactive-titlebar-opacity, 0.75) ); } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .toolbarbutton-icon { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .toolbarbutton-icon, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .toolbarbutton-icon, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .toolbarbutton-icon { fill-opacity: var(--inactive-toolbarbutton-icon-fill-opacity, 1); } /*= Tabpreviw transparent #890 ===============================================*/ @@ -876,7 +880,11 @@ } @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #titlebar, - :root[lwt-default-theme-in-dark-mode] #titlebar { + :root[lwt-default-theme-in-dark-mode] #titlebar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #toolbar-menubar, + :root[lwt-default-theme-in-dark-mode] #toolbar-menubar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #TabsToolbar, + :root[lwt-default-theme-in-dark-mode] #TabsToolbar { --button-hover-bgcolor: var(--win-sidebar-button-hover-bgcolor); --button-active-bgcolor: var(--win-sidebar-button-hover-active-bgcolor); --toolbarbutton-hover-background: var(--win-sidebar-button-hover-bgcolor); @@ -1228,11 +1236,17 @@ :root[lwt-default-theme-in-dark-mode] #navigator-toolbox { background-color: var(--mac-bgcolor) !important; } - :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #titlebar { + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #titlebar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #toolbar-menubar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #TabsToolbar { --mac-hover-bgcolor: ButtonFace; } :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #titlebar, - :root[lwt-default-theme-in-dark-mode] #titlebar { + :root[lwt-default-theme-in-dark-mode] #titlebar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #toolbar-menubar, + :root[lwt-default-theme-in-dark-mode] #toolbar-menubar, + :root:is(:not([lwtheme]), :not(:-moz-lwtheme)) #TabsToolbar, + :root[lwt-default-theme-in-dark-mode] #TabsToolbar { --button-hover-bgcolor: var(--mac-hover-bgcolor); --button-active-bgcolor: var(--mac-hover-bgcolor); --toolbarbutton-hover-background: var(--mac-hover-bgcolor); @@ -2510,7 +2524,9 @@ :root[style*="--focus-outline-color: rgb(172, 112, 255); --panel-separator-zap-gradient: linear-gradient(90deg, #9059FF 0%, #FF4AA2 52.08%, #FFBD4F 100%);"] { --lwt-accent-color: rgb(45, 36, 91) !important; } - #titlebar { + #titlebar, + #toolbar-menubar, + #TabsToolbar { --uc-frame-element-background: color-mix(in srgb, var(--lwt-accent-color, Window) 60%, transparent); --toolbarbutton-hover-background: color-mix(in srgb, var(--lwt-accent-color, Window) 85%, transparent); } @@ -2525,7 +2541,9 @@ (-moz-platform: windows-win7) and (prefers-color-scheme: dark), (-moz-gtk-csd-available) and (-moz-toolbar-prefers-color-scheme: dark), (-moz-gtk-csd-available) and (prefers-color-scheme: dark) { - #titlebar { + #titlebar, + #toolbar-menubar, + #TabsToolbar { --toolbarbutton-hover-background: color-mix( in srgb, var(--lwt-accent-color, Window) 40%, @@ -2605,7 +2623,9 @@ --lwt-accent-color: transparent !important; --lwt-text-color: WindowText !important; } - #titlebar .toolbarbutton-1 { + #titlebar .toolbarbutton-1, + #toolbar-menubar .toolbarbutton-1, + #TabsToolbar .toolbarbutton-1 { --toolbarbutton-icon-fill: var(--lwt-text-color) !important; } :root:not([sizemode="fullscreen"]) .titlebar-buttonbox-container .titlebar-button:not(.titlebar-close:hover) { @@ -5127,6 +5147,8 @@ display: flex !important; /* Needed for content to take up entire height, compatibility with tabs on bottom */ } :root[sizemode="fullscreen"] #titlebar, + :root[sizemode="fullscreen"] #toolbar-menubar, + :root[sizemode="fullscreen"] #TabsToolbar, :root[sizemode="fullscreen"] #nav-bar, :root[sizemode="fullscreen"] #PersonalToolbar, :root[sizemode="fullscreen"] #tab-notification-deck, @@ -5143,7 +5165,8 @@ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /*= Tabbar - Move to bottom ==================================================*/ - #titlebar { + #titlebar, + #TabsToolbar { order: 2; -moz-box-ordinal-group: 2; --tabs-navbar-shadow-size: 0px; @@ -5255,7 +5278,8 @@ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /*= Tabbar - Move to bottom ==================================================*/ - #titlebar { + #titlebar, + #TabsToolbar { order: 2; -moz-box-ordinal-group: 2; --tabs-navbar-shadow-size: 0px; @@ -5385,7 +5409,9 @@ margin-top: calc(var(--uc-tabbar-hide-height) + var(--uc-navbar-double-block)) !important; margin-bottom: var(--uc-navbar-block, 0px) !important; } - #titlebar { + #titlebar, + #toolbar-menubar, + #TabsToolbar { transform: translateY(var(--uc-navbar-block, 0px)); } #TabsToolbar > .titlebar-buttonbox-container { @@ -5487,7 +5513,9 @@ margin-top: calc(var(--uc-tabbar-hide-height) + var(--uc-navbar-double-block)) !important; margin-bottom: var(--uc-navbar-block, 0px) !important; } - #titlebar { + #titlebar, + #toolbar-menubar, + #TabsToolbar { transform: translateY(var(--uc-navbar-block, 0px)); } #TabsToolbar > .titlebar-buttonbox-container { @@ -5890,13 +5918,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -6049,13 +6083,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -6205,13 +6245,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -6380,13 +6426,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -6544,13 +6596,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -6703,13 +6761,19 @@ :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { visibility: collapse !important; } - :root[tabsintitlebar] #titlebar { + :root[tabsintitlebar] #titlebar, + :root[tabsintitlebar] #toolbar-menubar, + :root[tabsintitlebar] #TabsToolbar { z-index: 1; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive { + :root[tabsintitlebar] #titlebar:-moz-window-inactive, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; } - :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox { + :root[tabsintitlebar] #titlebar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive .titlebar-buttonbox, + :root[tabsintitlebar] #TabsToolbar:-moz-window-inactive .titlebar-buttonbox { opacity: var(--inactive-titlebar-opacity); } } @@ -10298,7 +10362,7 @@ margin-top: 0 !important; } :root[sizemode="fullscreen"]:not([inDOMFullscreen="true"]) - :-moz-any(#navigator-toolbox, #titlebar, #nav-bar, #PersonalToolbar) { + :-moz-any(#navigator-toolbox, #titlebar, #toolbar-menubar, #TabsToolbar, #nav-bar, #PersonalToolbar) { width: 100%; /* Makes the UI take up the entire width */ } :root[sizemode="fullscreen"]:not([inDOMFullscreen="true"]) #urlbar:popover-open { @@ -10768,7 +10832,8 @@ @supports -moz-bool-pref("userChrome.autohide.tabbar") or -moz-bool-pref("userChrome.autohide.navbar") { @supports -moz-bool-pref("userChrome.autohide.tabbar") or -moz-bool-pref("userChrome.tabbar.one_liner") { @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { - :root:not([customizing]) #titlebar { + :root:not([customizing]) #titlebar, + :root:not([customizing]) #navigator-toolbox > #TabsToolbar { margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } @@ -10786,7 +10851,8 @@ opacity: 0; } } - #navigator-toolbox:is(:hover, :focus-within) > #titlebar { + #navigator-toolbox:is(:hover, :focus-within) > #titlebar, + #navigator-toolbox:is(:hover, :focus-within) > #TabsToolbar { margin-bottom: 0px; } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { @@ -10803,7 +10869,8 @@ } @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { @media screen and (min-width: 1100px) { - :root:not([customizing]) #titlebar { + :root:not([customizing]) #titlebar, + :root:not([customizing]) #navigator-toolbox > #TabsToolbar { margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } @@ -10821,7 +10888,8 @@ opacity: 0; } } - #navigator-toolbox:is(:hover, :focus-within) > #titlebar { + #navigator-toolbox:is(:hover, :focus-within) > #titlebar, + #navigator-toolbox:is(:hover, :focus-within) > #TabsToolbar { margin-bottom: 0px; } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { @@ -10837,7 +10905,8 @@ } } @supports -moz-bool-pref("userChrome.autohide.tabbar") { - :root:not([customizing]) #titlebar { + :root:not([customizing]) #titlebar, + :root:not([customizing]) #navigator-toolbox > #TabsToolbar { margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } @@ -10855,7 +10924,8 @@ opacity: 0; } } - #navigator-toolbox:is(:hover, :focus-within) > #titlebar { + #navigator-toolbox:is(:hover, :focus-within) > #titlebar, + #navigator-toolbox:is(:hover, :focus-within) > #TabsToolbar { margin-bottom: 0px; } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { diff --git a/src/autohide/_tabbar.scss b/src/autohide/_tabbar.scss index fe377cb..bb334db 100644 --- a/src/autohide/_tabbar.scss +++ b/src/autohide/_tabbar.scss @@ -16,7 +16,8 @@ //------------------------------------------------------------------------------ @include OneLinerTabbar { - :root:not([customizing]) #titlebar { + :root:not([customizing]) #titlebar, + :root:not([customizing]) #navigator-toolbox > #TabsToolbar { margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } @@ -28,7 +29,8 @@ } #navigator-toolbox:is(:hover, :focus-within) { - > #titlebar { + > #titlebar, + > #TabsToolbar { margin-bottom: 0px; } #TabsToolbar { diff --git a/src/compatibility/_theme.scss b/src/compatibility/_theme.scss index 6328f2c..6daa9dc 100644 --- a/src/compatibility/_theme.scss +++ b/src/compatibility/_theme.scss @@ -193,7 +193,9 @@ vbox[part="drop-indicator-bar"] > image[part="drop-indicator"] { } /*= Inactive transparent #882 ================================================*/ -:root[tabsintitlebar] #titlebar:-moz-window-inactive { +:root[tabsintitlebar] #titlebar:-moz-window-inactive, +:root[tabsintitlebar] #toolbar-menubar:-moz-window-inactive, +:root[tabsintitlebar] #TabsToolbar:-moz-window-inactive { opacity: 1 !important; color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity, 0.75) * 100%), transparent) !important; --inactive-toolbarbutton-icon-fill-opacity: calc(var(--toolbarbutton-icon-fill-opacity, 1) * var(--inactive-titlebar-opacity, 0.75)); diff --git a/src/fullscreen/_overlap.scss b/src/fullscreen/_overlap.scss index 326e2d7..dc1d49c 100644 --- a/src/fullscreen/_overlap.scss +++ b/src/fullscreen/_overlap.scss @@ -7,7 +7,7 @@ } } -:root[sizemode="fullscreen"]:not([inDOMFullscreen="true"]) :-moz-any(#navigator-toolbox, #titlebar, #nav-bar, #PersonalToolbar) { +:root[sizemode="fullscreen"]:not([inDOMFullscreen="true"]) :-moz-any(#navigator-toolbox, #titlebar, #toolbar-menubar, #TabsToolbar, #nav-bar, #PersonalToolbar) { width: 100%; /* Makes the UI take up the entire width */ } diff --git a/src/tabbar/_index.scss b/src/tabbar/_index.scss index 2f28f58..b13c753 100644 --- a/src/tabbar/_index.scss +++ b/src/tabbar/_index.scss @@ -6,6 +6,8 @@ // flex-wrap: wrap; // Disabled at #700 } :root[sizemode="fullscreen"] #titlebar, + :root[sizemode="fullscreen"] #toolbar-menubar, + :root[sizemode="fullscreen"] #TabsToolbar, :root[sizemode="fullscreen"] #nav-bar, :root[sizemode="fullscreen"] #PersonalToolbar, :root[sizemode="fullscreen"] #tab-notification-deck, diff --git a/src/tabbar/_on_bottom.scss b/src/tabbar/_on_bottom.scss index 489bb49..55080d9 100644 --- a/src/tabbar/_on_bottom.scss +++ b/src/tabbar/_on_bottom.scss @@ -2,7 +2,8 @@ See the above repository for updates as well as full license text. */ /*= Tabbar - Move to bottom ==================================================*/ -#titlebar { +#titlebar, +#TabsToolbar { @include BoxOrder(2) /* When userChrome.fullscreen.overlap */; --tabs-navbar-shadow-size: 0px; } diff --git a/src/tabbar/_one_liner.scss b/src/tabbar/_one_liner.scss index b4ccba9..52c297b 100644 --- a/src/tabbar/_one_liner.scss +++ b/src/tabbar/_one_liner.scss @@ -19,7 +19,9 @@ // transform: translateY(calc(-1 * var(--uc-navbar-block, 0px))); } -#titlebar { +#titlebar, +#toolbar-menubar, +#TabsToolbar { transform: translateY(var(--uc-navbar-block, 0px)); } #TabsToolbar > .titlebar-buttonbox-container { diff --git a/src/tabbar/layout/_window_control.scss b/src/tabbar/layout/_window_control.scss index 2c45148..845331b 100644 --- a/src/tabbar/layout/_window_control.scss +++ b/src/tabbar/layout/_window_control.scss @@ -130,12 +130,16 @@ See the above repository for updates as well as full license text. */ } } - :root[tabsintitlebar] #titlebar { - z-index: 1; - &:-moz-window-inactive { - opacity: 1 !important; - .titlebar-buttonbox { - opacity: var(--inactive-titlebar-opacity); + :root[tabsintitlebar] { + #titlebar, + #toolbar-menubar, + #TabsToolbar { + z-index: 1; + &:-moz-window-inactive { + opacity: 1 !important; + .titlebar-buttonbox { + opacity: var(--inactive-titlebar-opacity); + } } } } diff --git a/src/theme/system_default_theme/_mac.scss b/src/theme/system_default_theme/_mac.scss index f48da86..de5030c 100644 --- a/src/theme/system_default_theme/_mac.scss +++ b/src/theme/system_default_theme/_mac.scss @@ -184,10 +184,14 @@ background-color: var(--mac-bgcolor) !important; } - :root#{$not_lwtheme} #titlebar { + :root#{$not_lwtheme} #titlebar, + :root#{$not_lwtheme} #toolbar-menubar, + :root#{$not_lwtheme} #TabsToolbar { --mac-hover-bgcolor: ButtonFace; } - #{selector.nest(system-default-theme(), "#titlebar")} { + #{selector.nest(system-default-theme(), "#titlebar")}, + #{selector.nest(system-default-theme(), "#toolbar-menubar")}, + #{selector.nest(system-default-theme(), "#TabsToolbar")} { --button-hover-bgcolor: var(--mac-hover-bgcolor); --button-active-bgcolor: var(--mac-hover-bgcolor); --toolbarbutton-hover-background: var(--mac-hover-bgcolor); diff --git a/src/theme/system_default_theme/_win10.scss b/src/theme/system_default_theme/_win10.scss index 3d9c7e8..48d53be 100644 --- a/src/theme/system_default_theme/_win10.scss +++ b/src/theme/system_default_theme/_win10.scss @@ -286,7 +286,9 @@ } /*- Toolbar ----------------------------------------------------------------*/ - #{selector.nest(system-default-theme(), "#titlebar")} { + #{selector.nest(system-default-theme(), "#titlebar")}, + #{selector.nest(system-default-theme(), "#toolbar-menubar")}, + #{selector.nest(system-default-theme(), "#TabsToolbar")} { --button-hover-bgcolor: var(--win-sidebar-button-hover-bgcolor); --button-active-bgcolor: var(--win-sidebar-button-hover-active-bgcolor); --toolbarbutton-hover-background: var(--win-sidebar-button-hover-bgcolor); diff --git a/src/theme/transparent/_general_element_background.scss b/src/theme/transparent/_general_element_background.scss index 7287ce3..dea3edd 100644 --- a/src/theme/transparent/_general_element_background.scss +++ b/src/theme/transparent/_general_element_background.scss @@ -17,7 +17,9 @@ ); } -#titlebar { +#titlebar, +#toolbar-menubar, +#TabsToolbar { --uc-frame-element-background: #{ frameTransparent() }; --toolbarbutton-hover-background: #{ frameTransparent(85%) }; diff --git a/src/theme/transparent/_win11.scss b/src/theme/transparent/_win11.scss index 73f661b..adea6e9 100644 --- a/src/theme/transparent/_win11.scss +++ b/src/theme/transparent/_win11.scss @@ -7,8 +7,12 @@ --lwt-text-color: WindowText !important; } -#titlebar .toolbarbutton-1 { - --toolbarbutton-icon-fill: var(--lwt-text-color) !important; +#titlebar, +#toolbar-menubar, +#TabsToolbar { + .toolbarbutton-1 { + --toolbarbutton-icon-fill: var(--lwt-text-color) !important; + } } :root:not([sizemode="fullscreen"]) .titlebar-buttonbox-container .titlebar-button:not(.titlebar-close:hover) {