diff --git a/css/leptonChrome.css b/css/leptonChrome.css index 06f3a6c..7b25a5b 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -4408,7 +4408,7 @@ /* Same as .titlebar-spacer[type="pre-tabs"] - Extra space reserved on both sides of the nav-bar to be able to drag the window */ --uc-window-drag-space-post: 0px; /* Same as .titlebar-spacer[type="post-tabs"] */ - --uc-widow-control-space: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post)); + --uc-window-control-space: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post)); } :root:is([tabsintitlebar], [sizemode="fullscreen"]) { @@ -4430,12 +4430,16 @@ --uc-window-control-width: 138px; } } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + :root[tabsintitlebar] { --uc-window-control-width: 72px; } - } + :root[sizemode="fullscreen"] { + --uc-window-control-space: 0; + } + } :root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) { --uc-window-drag-space-pre: 0px; /* Remove pre space */ @@ -4483,6 +4487,11 @@ left: 0; right: unset !important; } + + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; + } } #navigator-toolbox { padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important; @@ -4626,6 +4635,156 @@ left: 0; right: unset !important; } + + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; + } + } + #navigator-toolbox { + padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important; + } + + :root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container { + height: 32px; + } + + @supports not -moz-bool-pref("userChrome.hidden.tabbar") { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + opacity: 0; + visibility: collapse; + } + } + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + opacity: 1; + visibility: visible; + } + @supports -moz-bool-pref("userChrome.autohide.navbar") { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + opacity: 0; + visibility: collapse; + } + } + } + + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + @supports -moz-bool-pref("userChrome.autohide.navbar") { + #navigator-toolbox:is(:hover, :focus-within) + #toolbar-menubar[inactive]:not([customizing]) + > .titlebar-buttonbox-container { + opacity: 1; + visibility: visible; + } + } + } + + @media (prefers-reduced-motion: no-preference) { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms), + visibility 100ms var(--animation-easing-function) 0.25s !important; + } + + #navigator-toolbox:is(:hover, :focus-within) + #toolbar-menubar[inactive]:not([customizing]) + > .titlebar-buttonbox-container { + transition-delay: 0s !important; + } + } + .titlebar-buttonbox-container > .titlebar-buttonbox { + height: 100%; + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container > .titlebar-buttonbox { + margin-block: 10px; + } + } + + /* At Full Screen */ + :root[sizemode="fullscreen"] #window-controls { + position: fixed; + display: flex; + top: 0; + right: 0; + height: 40px; + } + + :root[uidensity="compact"][sizemode="fullscreen"] #window-controls { + height: 32px; + } + + @supports -moz-bool-pref("browser.fullscreen.autohide") { + :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container { + visibility: hidden; + } + } + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + :root[inFullscreen]:not([macOSNativeFullscreen]) #toolbar-menubar { + visibility: visible !important; + min-height: 0 !important; + max-height: 0 !important; + } + :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { + visibility: collapse !important; + } + } + /* At Activated Menubar */ + :root:not([chromehidden~="menubar"], [sizemode="fullscreen"]) + #toolbar-menubar:not([autohide="true"]) + + #TabsToolbar + > .titlebar-buttonbox-container { + display: block !important; + } + + @supports not -moz-bool-pref("userChrome.hidden.tabbar") { + :root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container { + visibility: hidden; + } + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + /*= Windows Control - Move to toolbar ========================================*/ + /* 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. */ + :root { + --uc-titlebar-padding: 0px; + } + + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + :root[sizemode="maximized"][tabsintitlebar] { + --uc-titlebar-padding: 8px; + } + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, + #TabsToolbar > .titlebar-buttonbox-container { + position: fixed; + display: block; + top: var(--uc-titlebar-padding); + right: 0; + height: 40px; + z-index: 1; + } + + /* where window controls are on left */ + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + :root { + --uc-titlebar-padding: 0px !important; + } + + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; + } } #navigator-toolbox { padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important; @@ -4769,6 +4928,11 @@ left: 0; right: unset !important; } + + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; + } } #navigator-toolbox { padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important; @@ -4883,8 +5047,8 @@ } } } - @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - @media screen and (min-width: 1100px) { + @media screen and (min-width: 1100px) { + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { /*= Windows Control - Move to toolbar ========================================*/ /* 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. */ @@ -4922,6 +5086,11 @@ left: 0; right: unset !important; } + + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; + } } #navigator-toolbox { padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important; @@ -4961,23 +5130,18 @@ } } - /* At Full Screen */ + @media screen and (min-width: 1100px) and (prefers-reduced-motion: no-preference) { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms), + visibility 100ms var(--animation-easing-function) 0.25s !important; + } - /* At Activated Menubar */ - } - @media screen and (min-width: 1100px) and (prefers-reduced-motion: no-preference) { - #toolbar-menubar[inactive] > .titlebar-buttonbox-container { - transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms), - visibility 100ms var(--animation-easing-function) 0.25s !important; + #navigator-toolbox:is(:hover, :focus-within) + #toolbar-menubar[inactive]:not([customizing]) + > .titlebar-buttonbox-container { + transition-delay: 0s !important; + } } - - #navigator-toolbox:is(:hover, :focus-within) - #toolbar-menubar[inactive]:not([customizing]) - > .titlebar-buttonbox-container { - transition-delay: 0s !important; - } - } - @media screen and (min-width: 1100px) { .titlebar-buttonbox-container > .titlebar-buttonbox { height: 100%; } @@ -4986,8 +5150,8 @@ margin-block: 10px; } } - } - @media screen and (min-width: 1100px) { + + /* At Full Screen */ :root[sizemode="fullscreen"] #window-controls { position: fixed; display: flex; @@ -4995,20 +5159,16 @@ right: 0; height: 40px; } - } - @media screen and (min-width: 1100px) { + :root[uidensity="compact"][sizemode="fullscreen"] #window-controls { height: 32px; } - } - @media screen and (min-width: 1100px) { + @supports -moz-bool-pref("browser.fullscreen.autohide") { :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container { visibility: hidden; } } - } - @media screen and (min-width: 1100px) { @supports -moz-bool-pref("userChrome.hidden.tabbar") { :root[inFullscreen]:not([macOSNativeFullscreen]) #toolbar-menubar { visibility: visible !important; @@ -5019,16 +5179,159 @@ visibility: collapse !important; } } - } - @media screen and (min-width: 1100px) { + /* At Activated Menubar */ :root:not([chromehidden~="menubar"], [sizemode="fullscreen"]) #toolbar-menubar:not([autohide="true"]) + #TabsToolbar > .titlebar-buttonbox-container { display: block !important; } + + @supports not -moz-bool-pref("userChrome.hidden.tabbar") { + :root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container { + visibility: hidden; + } + } } - @media screen and (min-width: 1100px) { + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + /*= Windows Control - Move to toolbar ========================================*/ + /* 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. */ + :root { + --uc-titlebar-padding: 0px; + } + + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + :root[sizemode="maximized"][tabsintitlebar] { + --uc-titlebar-padding: 8px; + } + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, + #TabsToolbar > .titlebar-buttonbox-container { + position: fixed; + display: block; + top: var(--uc-titlebar-padding); + right: 0; + height: 40px; + z-index: 1; + } + + /* where window controls are on left */ + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + :root { + --uc-titlebar-padding: 0px !important; + } + + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; + } + } + #navigator-toolbox { + padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important; + } + + :root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container { + height: 32px; + } + + @supports not -moz-bool-pref("userChrome.hidden.tabbar") { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + opacity: 0; + visibility: collapse; + } + } + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + opacity: 1; + visibility: visible; + } + @supports -moz-bool-pref("userChrome.autohide.navbar") { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + opacity: 0; + visibility: collapse; + } + } + } + + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + @supports -moz-bool-pref("userChrome.autohide.navbar") { + #navigator-toolbox:is(:hover, :focus-within) + #toolbar-menubar[inactive]:not([customizing]) + > .titlebar-buttonbox-container { + opacity: 1; + visibility: visible; + } + } + } + + @media screen and (min-width: 1100px) and (prefers-reduced-motion: no-preference) { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms), + visibility 100ms var(--animation-easing-function) 0.25s !important; + } + + #navigator-toolbox:is(:hover, :focus-within) + #toolbar-menubar[inactive]:not([customizing]) + > .titlebar-buttonbox-container { + transition-delay: 0s !important; + } + } + .titlebar-buttonbox-container > .titlebar-buttonbox { + height: 100%; + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container > .titlebar-buttonbox { + margin-block: 10px; + } + } + + /* At Full Screen */ + :root[sizemode="fullscreen"] #window-controls { + position: fixed; + display: flex; + top: 0; + right: 0; + height: 40px; + } + + :root[uidensity="compact"][sizemode="fullscreen"] #window-controls { + height: 32px; + } + + @supports -moz-bool-pref("browser.fullscreen.autohide") { + :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container { + visibility: hidden; + } + } + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + :root[inFullscreen]:not([macOSNativeFullscreen]) #toolbar-menubar { + visibility: visible !important; + min-height: 0 !important; + max-height: 0 !important; + } + :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { + visibility: collapse !important; + } + } + /* At Activated Menubar */ + :root:not([chromehidden~="menubar"], [sizemode="fullscreen"]) + #toolbar-menubar:not([autohide="true"]) + + #TabsToolbar + > .titlebar-buttonbox-container { + display: block !important; + } + @supports not -moz-bool-pref("userChrome.hidden.tabbar") { :root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container { visibility: hidden; @@ -5043,22 +5346,44 @@ @supports -moz-bool-pref("userChrome.tabbar.one_liner") { @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - /* Don't need pre spacer */ - --uc-window-drag-space-pre: 0px; + @media (-moz-gtk-csd-available), + (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + /* Don't need pre spacer */ + --uc-window-drag-space-pre: 0px; + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + /* Don't need window control */ + --uc-window-control-space: 0px; + } } @supports -moz-bool-pref("userChrome.tabbar.as_titlebar") { :root:is([tabsintitlebar], [sizemode="fullscreen"]) #tabbrowser-tabs { /* Don't need window control */ - --uc-widow-control-space: 0px; + --uc-window-control-space: 0px; } } } @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { @supports not -moz-bool-pref("userChrome.tabbar.as_titlebar") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - /* Don't need window control */ - --uc-widow-control-space: 0px; + @media (-moz-gtk-csd-available), + (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + /* Don't need window control */ + --uc-window-control-space: 0px; + } } } } @@ -5070,28 +5395,50 @@ /* Don't need pre spacer */ --uc-window-drag-space-pre: 0px; /* Don't need window control */ - --uc-widow-control-space: 0px; + --uc-window-control-space: 0px; } } } @media screen and (min-width: 1100px) { @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - /* Don't need pre spacer */ - --uc-window-drag-space-pre: 0px; + @media (-moz-gtk-csd-available), + (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + /* Don't need pre spacer */ + --uc-window-drag-space-pre: 0px; + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + /* Don't need window control */ + --uc-window-control-space: 0px; + } } @supports -moz-bool-pref("userChrome.tabbar.as_titlebar") { :root:is([tabsintitlebar], [sizemode="fullscreen"]) #tabbrowser-tabs { /* Don't need window control */ - --uc-widow-control-space: 0px; + --uc-window-control-space: 0px; } } } @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { @supports not -moz-bool-pref("userChrome.tabbar.as_titlebar") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - /* Don't need window control */ - --uc-widow-control-space: 0px; + @media (-moz-gtk-csd-available), + (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + /* Don't need window control */ + --uc-window-control-space: 0px; + } } } } @@ -5102,46 +5449,40 @@ border-inline-style: solid !important; border-inline-color: transparent; } - @supports not -moz-bool-pref("userChrome.tabbar.one_liner") { - #nav-bar { - border-inline-start-width: var(--uc-window-drag-space-pre); - border-inline-end-width: var(--uc-widow-control-space); - } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner") { - @supports -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @media (-moz-gtk-csd-available), + (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner") { #nav-bar { border-inline-start-width: var(--uc-window-drag-space-pre); - border-inline-end-width: var(--uc-widow-control-space); + border-inline-end-width: var(--uc-window-control-space); } } - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { - @supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.hidden.tabbar") { - @media screen and (max-width: 1100px) { - #nav-bar { - border-inline-start-width: var(--uc-window-drag-space-pre); - border-inline-end-width: var(--uc-widow-control-space); + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + #nav-bar { + border-inline-start-width: var(--uc-window-drag-space-pre); + border-inline-end-width: var(--uc-window-control-space); + } + } + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.hidden.tabbar") { + @media screen and (max-width: 1100px) { + #nav-bar { + border-inline-start-width: var(--uc-window-drag-space-pre); + border-inline-end-width: var(--uc-window-control-space); + } } } } } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner") { - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - #nav-bar { - margin-inline-start: var(--uc-window-drag-space-pre) !important; - } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - #nav-bar { - margin-inline-end: var(--uc-widow-control-space) !important; - } - } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { - @media screen and (min-width: 1100px) { + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { #nav-bar { margin-inline-start: var(--uc-window-drag-space-pre) !important; @@ -5149,7 +5490,21 @@ } @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { #nav-bar { - margin-inline-end: var(--uc-widow-control-space) !important; + margin-inline-end: var(--uc-window-control-space) !important; + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @media screen and (min-width: 1100px) { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-start: var(--uc-window-drag-space-pre) !important; + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-end: var(--uc-window-control-space) !important; + } } } } @@ -5162,14 +5517,14 @@ @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { @supports not -moz-bool-pref("userChrome.tabbar.one_liner") { :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - border-inline-start-width: var(--uc-widow-control-space); + border-inline-start-width: var(--uc-window-control-space); border-inline-end-width: var(--uc-window-drag-space-pre); } } @supports -moz-bool-pref("userChrome.tabbar.one_liner") { @supports -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - border-inline-start-width: var(--uc-widow-control-space); + border-inline-start-width: var(--uc-window-control-space); border-inline-end-width: var(--uc-window-drag-space-pre); } } @@ -5177,7 +5532,7 @@ @supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.hidden.tabbar") { @media screen and (max-width: 1100px) { :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - border-inline-start-width: var(--uc-widow-control-space); + border-inline-start-width: var(--uc-window-control-space); border-inline-end-width: var(--uc-window-drag-space-pre); } } @@ -5189,12 +5544,12 @@ @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - margin-inline-start: var(--uc-window-drag-space-pre, 0px) !important; + margin-inline-start: var(--uc-window-control-space, 0px) !important; } } @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - margin-inline-end: var(--uc-widow-control-space, 0px) !important; + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; } } } @@ -5202,12 +5557,12 @@ @media screen and (min-width: 1100px) { @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - margin-inline-start: var(--uc-window-drag-space-pre, 0px) !important; + margin-inline-start: var(--uc-window-control-space, 0px) !important; } } @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - margin-inline-end: var(--uc-widow-control-space, 0px) !important; + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; } } } @@ -5215,6 +5570,41 @@ } } + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + :root[tabsintitlebar="true"]:not([inFullscreen]) #TabsToolbar { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @media screen and (min-width: 1100px) { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + :root[tabsintitlebar="true"]:not([inFullscreen]) #TabsToolbar { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + :root[tabsintitlebar="true"]:not([inFullscreen]) #TabsToolbar { + margin-inline-start: var(--uc-window-control-width, 0px) !important; + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @media screen and (min-width: 1100px) { + :root[tabsintitlebar="true"]:not([inFullscreen]) #TabsToolbar { + margin-inline-start: var(--uc-window-control-width, 0px) !important; + } + } + } + } + } + :root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child, :root[sizemode="fullscreen"] #window-controls { right: unset; @@ -5239,7 +5629,7 @@ .tabbrowser-tab[selected="true"] { -moz-window-dragging: drag; --tab-max-width: 100vw; - min-width: calc(var(--uc-tabbar-width, 100vw) - var(--uc-widow-control-space)) !important; + min-width: calc(var(--uc-tabbar-width, 100vw) - var(--uc-window-control-space)) !important; max-width: var(--tab-max-width) !important; margin-inline-start: calc(var(--tab-shadow-max-size) * -1) !important; } diff --git a/src/tabbar/_as_titlebar.scss b/src/tabbar/_as_titlebar.scss index 2bdacab..7d6fcb0 100644 --- a/src/tabbar/_as_titlebar.scss +++ b/src/tabbar/_as_titlebar.scss @@ -28,7 +28,7 @@ spacer:is([part="overflow-start-indicator"], [part="overflow-end-indicator"]), .tabbrowser-tab[selected="true"] { -moz-window-dragging: drag; --tab-max-width: 100vw; - min-width: calc(var(--uc-tabbar-width, 100vw) - var(--uc-widow-control-space)) !important; + min-width: calc(var(--uc-tabbar-width, 100vw) - var(--uc-window-control-space)) !important; max-width: var(--tab-max-width) !important; margin-inline-start: calc(var(--tab-shadow-max-size) * -1) !important; diff --git a/src/tabbar/_layout.scss b/src/tabbar/_layout.scss index b6fed2c..9c78c6a 100644 --- a/src/tabbar/_layout.scss +++ b/src/tabbar/_layout.scss @@ -1,3 +1,15 @@ +//-- Mixin --------------------------------------------------------------------- +@mixin _oneLiner_windowControl() { + @include Option("userChrome.tabbar.one_liner.tabbar_first") { + @content; + } + @include OS($mac) { + @content; + } +} + +//------------------------------------------------------------------------------ + @include NotOption("userChrome.tabbar.one_liner") { @include Option("userChrome.tabbar.on_bottom", "userChrome.hidden.tabbar") { @import "layout/window_control"; @@ -5,7 +17,7 @@ } @include Option("userChrome.tabbar.one_liner") { @include NotOption("userChrome.tabbar.one_liner.responsive") { - @include Option("userChrome.tabbar.one_liner.tabbar_first") { + @include _oneLiner_windowControl() { @import "layout/window_control"; } } @@ -15,8 +27,8 @@ @import "layout/window_control"; } } - @include Option("userChrome.tabbar.one_liner.tabbar_first") { - @media screen and (min-width: 1100px) { + @media screen and (min-width: 1100px) { + @include _oneLiner_windowControl() { @import "layout/window_control"; } } diff --git a/src/tabbar/layout/_navbar_padding.scss b/src/tabbar/layout/_navbar_padding.scss index 41f22b5..d5b5d03 100644 --- a/src/tabbar/layout/_navbar_padding.scss +++ b/src/tabbar/layout/_navbar_padding.scss @@ -9,12 +9,17 @@ @mixin _remove_spacer_post() { /* Don't need window control */ - --uc-widow-control-space: 0px; + --uc-window-control-space: 0px; } @mixin _remove_spacer_oneLiner() { @include Option("userChrome.tabbar.one_liner.tabbar_first") { - @include _remove_spacer_pre; + @include OS($win, $linux) { + @include _remove_spacer_pre; + } + @include OS($mac) { + @include _remove_spacer_post; + } @include Option("userChrome.tabbar.as_titlebar") { #tabbrowser-tabs { @include _remove_spacer_post; @@ -23,7 +28,9 @@ } @include NotOption("userChrome.tabbar.one_liner.tabbar_first") { @include NotOption("userChrome.tabbar.as_titlebar") { - @include _remove_spacer_post; + @include OS($win, $linux) { + @include _remove_spacer_post; + } } } } @@ -84,18 +91,20 @@ border-inline-style: solid !important; border-inline-color: transparent; - @include _oneLiner_navBar_borderPadding { - border-inline-start-width: var(--uc-window-drag-space-pre); - border-inline-end-width: var(--uc-widow-control-space); - } + @include OS($win, $linux) { + @include _oneLiner_navBar_borderPadding { + border-inline-start-width: var(--uc-window-drag-space-pre); + border-inline-end-width: var(--uc-window-control-space); + } - @include Option("userChrome.tabbar.one_liner") { - @include _oneLiner_navBar_marginGap { - @include NotOption("userChrome.tabbar.one_liner.tabbar_first") { - margin-inline-start: var(--uc-window-drag-space-pre) !important; - } - @include Option("userChrome.tabbar.one_liner.tabbar_first") { - margin-inline-end: var(--uc-widow-control-space) !important; + @include Option("userChrome.tabbar.one_liner") { + @include _oneLiner_navBar_marginGap { + @include NotOption("userChrome.tabbar.one_liner.tabbar_first") { + margin-inline-start: var(--uc-window-drag-space-pre) !important; + } + @include Option("userChrome.tabbar.one_liner.tabbar_first") { + margin-inline-end: var(--uc-window-control-space) !important; + } } } } @@ -106,17 +115,31 @@ @include OS($mac) { :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { @include _oneLiner_navBar_borderPadding { - border-inline-start-width: var(--uc-widow-control-space); + border-inline-start-width: var(--uc-window-control-space); border-inline-end-width: var(--uc-window-drag-space-pre); } @include Option("userChrome.tabbar.one_liner") { @include _oneLiner_navBar_marginGap { @include NotOption("userChrome.tabbar.one_liner.tabbar_first") { - margin-inline-start: var(--uc-window-drag-space-pre, 0px) !important; + margin-inline-start: var(--uc-window-control-space, 0px) !important; } @include Option("userChrome.tabbar.one_liner.tabbar_first") { - margin-inline-end: var(--uc-widow-control-space, 0px) !important; + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + } + } + :root[tabsintitlebar="true"]:not([inFullscreen]) #TabsToolbar { + @include Option("userChrome.tabbar.one_liner") { + @include _oneLiner_navBar_marginGap { + @include NotOption("userChrome.tabbar.one_liner.tabbar_first") { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + @include Option("userChrome.tabbar.one_liner.tabbar_first") { + @include OneLinerContent { + margin-inline-start: var(--uc-window-control-width, 0px) !important; } } } diff --git a/src/tabbar/layout/_window_control.scss b/src/tabbar/layout/_window_control.scss index eef3fc9..ca11c3d 100644 --- a/src/tabbar/layout/_window_control.scss +++ b/src/tabbar/layout/_window_control.scss @@ -30,6 +30,11 @@ See the above repository for updates as well as full license text. */ left:0; right: unset !important; } + + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; + } } #navigator-toolbox { diff --git a/src/tabbar/layout/_window_control_size.scss b/src/tabbar/layout/_window_control_size.scss index c3bb050..a7f5b59 100644 --- a/src/tabbar/layout/_window_control_size.scss +++ b/src/tabbar/layout/_window_control_size.scss @@ -3,7 +3,7 @@ --uc-window-drag-space-pre: 0px; /* Same as .titlebar-spacer[type="pre-tabs"] - Extra space reserved on both sides of the nav-bar to be able to drag the window */ --uc-window-drag-space-post: 0px; /* Same as .titlebar-spacer[type="post-tabs"] */ - --uc-widow-control-space: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post)); + --uc-window-control-space: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post)); } :root:is([tabsintitlebar], [sizemode="fullscreen"]) { @@ -17,9 +17,14 @@ @include OS($win10) { --uc-window-control-width: 138px; } - @include OS($mac) { +} +@include OS($mac) { + :root[tabsintitlebar] { --uc-window-control-width: 72px; } + :root[sizemode="fullscreen"] { + --uc-window-control-space: 0; + } } :root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) {