diff --git a/chrome/navbar_tabs_oneliner.css b/chrome/navbar_tabs_oneliner.css index 932c931..13eae49 100644 --- a/chrome/navbar_tabs_oneliner.css +++ b/chrome/navbar_tabs_oneliner.css @@ -8,7 +8,9 @@ See the above repository for updates as well as full license text. */ /* urlbar_popup_full_width.css is VERY MUCH recommended for Firefox 71+ because of new urlbar popup */ - +:root[tabsintitlebar][sizemode="normal"]{ + --uc-window-drag-space-width: 24px; +} :root[uidensity="compact"]{ --tab-block-margin: 2px !important; } @@ -51,12 +53,24 @@ urlbar_popup_full_width.css is VERY MUCH recommended for Firefox 71+ because of } /* Window drag space */ -:root[tabsintitlebar="true"] #nav-bar{ padding-left: 24px !important } +:root[tabsintitlebar="true"] #nav-bar{ padding-left: var(--uc-window-drag-space-width) !important } -/* Rules specific to window controls on right layout */ -@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){ - .titlebar-buttonbox-container{ position: fixed; display: block; left: 0px; z-index: 3; } - :root[tabsintitlebar="true"] #nav-bar{ padding-left: 96px !important; padding-right: 0px !important; } +/* Rules for window controls on left layout */ + +@media (-moz-gtk-csd-reversed-placement), + (-moz-platform: macos){ + .titlebar-buttonbox-container{ + position: fixed; + display: flex; + left: 0px; + z-index: 3; + height: var(--uc-toolbar-height); + align-items: center + } + :root[tabsintitlebar="true"] #nav-bar{ padding-inline: calc(var(--uc-window-drag-space-width,0px) + 84px) 0px !important; } +} +@media (-moz-platform: macos){ + :root[tabsintitlebar="true"] #nav-bar{ padding-inline: calc(var(--uc-window-drag-space-width,0px) + 72px) 0px !important; } } /* 1px margin on touch density causes tabs to be too high */ diff --git a/chrome/navbar_tabs_responsive_oneliner.css b/chrome/navbar_tabs_responsive_oneliner.css index 53b4235..8c9bed9 100644 --- a/chrome/navbar_tabs_responsive_oneliner.css +++ b/chrome/navbar_tabs_responsive_oneliner.css @@ -11,7 +11,9 @@ See the above repository for updates as well as full license text. */ /* Modify it to suit your needs */ @media screen and (min-width: 1100px){ - + :root[tabsintitlebar][sizemode="normal"]{ + --uc-window-drag-space-width: 24px; + } :root[uidensity="compact"]{ --tab-block-margin: 2px !important; } @@ -53,12 +55,24 @@ See the above repository for updates as well as full license text. */ } /* Window drag space */ - :root[tabsintitlebar="true"] #nav-bar{ padding-left: 24px !important } + :root[tabsintitlebar="true"] #nav-bar{ padding-left: var(--uc-window-drag-space-width) !important } -/* Rules specific to window controls on right layout */ - @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){ - .titlebar-buttonbox-container{ position: fixed; display: block; left: 0px; z-index: 3; } - :root[tabsintitlebar="true"] #nav-bar{ padding-left: 96px !important; padding-right: 0px !important; } + /* Rules for window controls on left layout */ + + @media (-moz-gtk-csd-reversed-placement), + (-moz-platform: macos){ + .titlebar-buttonbox-container{ + position: fixed; + display: flex; + left: 0px; + z-index: 3; + height: var(--uc-toolbar-height); + align-items: center + } + :root[tabsintitlebar="true"] #nav-bar{ padding-inline: calc(var(--uc-window-drag-space-width,0px) + 84px) 0px !important; } + } + @media (-moz-platform: macos){ + :root[tabsintitlebar="true"] #nav-bar{ padding-inline: calc(var(--uc-window-drag-space-width,0px) + 72px) 0px !important; } } /* 1px margin on touch density causes tabs to be too high */ diff --git a/chrome/overlay_menubar.css b/chrome/overlay_menubar.css index 7e6547e..8cad109 100644 --- a/chrome/overlay_menubar.css +++ b/chrome/overlay_menubar.css @@ -32,6 +32,6 @@ See the above repository for updates as well as full license text. */ background-image: linear-gradient(to right, var(--arrowpanel-background) 30%, transparent); } -@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){ +@media (-moz-gtk-csd-reversed-placement){ #toolbar-menubar[autohide="true"]:not([inactive]) > .titlebar-buttonbox-container{ display: none } -} \ No newline at end of file +} diff --git a/chrome/tabs_on_bottom.css b/chrome/tabs_on_bottom.css index 11da065..7e37827 100644 --- a/chrome/tabs_on_bottom.css +++ b/chrome/tabs_on_bottom.css @@ -23,8 +23,11 @@ linux_gtk_window_control_patch.css right:0; height: 40px; } -/* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */ -@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){ +@media (-moz-gtk-csd-reversed-placement), + (-moz-platform: macos){ + .titlebar-buttonbox-container{ left:0; right: unset !important; } +} +@supports -moz-bool-pref("userchrome.window-controls-on-left.enabled"){ .titlebar-buttonbox-container{ left:0; right: unset !important; } } diff --git a/chrome/window_control_placeholder_support.css b/chrome/window_control_placeholder_support.css index bc45d11..3a78051 100644 --- a/chrome/window_control_placeholder_support.css +++ b/chrome/window_control_placeholder_support.css @@ -35,8 +35,12 @@ See the above repository for updates as well as full license text. */ --uc-window-control-width: 84px; } } +@media (-moz-platform: macos){ + :root:is([tabsintitlebar],[sizemode="fullscreen"]) { + --uc-window-control-width: 72px; + } +} -/* macOS settings are further below */ .titlebar-buttonbox, #window-controls{ color: var(--toolbar-color) } :root[sizemode="fullscreen"] .titlebar-buttonbox-container{ display: none } :root[sizemode="fullscreen"] #navigator-toolbox { position: relative; } @@ -59,15 +63,24 @@ See the above repository for updates as well as full license text. */ border-right-width: calc(var(--uc-window-control-width,0px) + var(--uc-window-drag-space-post,0px)); } -/* Use this pref to check Mac OS where window controls are on left */ -/* This pref defaults to true on Mac and doesn't actually do anything on other platforms. So if your system has window controls on LEFT side you can set the pref to true */ -@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){ - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - --uc-window-control-width: 72px; - } - :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{ +/* Rules for window controls on left layout */ +@media (-moz-gtk-csd-reversed-placement), + (-moz-platform: macos){ + :root[tabsintitlebar="true"] #nav-bar{ border-inline-width: calc(var(--uc-window-control-width,0px) + var(--uc-window-drag-space-post,0px)) var(--uc-window-drag-space-pre,0px) } :root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child, :root[sizemode="fullscreen"] #window-controls{ right: unset } } + +/* This pref can be used to force window controls on left even if that is not normal behavior on your OS */ +@supports -moz-bool-pref("userchrome.force-window-controls-on-left.enabled"){ + :root[tabsintitlebar="true"] #nav-bar{ + border-inline-width: calc(var(--uc-window-control-width,0px) + var(--uc-window-drag-space-post,0px)) var(--uc-window-drag-space-pre,0px) + } + :root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child, + :root[sizemode="fullscreen"] #window-controls{ right: unset; } + .titlebar-buttonbox-container{ -moz-box-ordinal-group: 0 !important; } + .titlebar-buttonbox{ -moz-box-direction: reverse } +} +