/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/navbar_tabs_oneliner_menu_buttons_on_right.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /* Variation of oneliner where menubutton and overflow button are next to window controls (if window controls are on right side) */ /* IMPORTANT */ /* Get window_control_placeholder_support.css Window controls will be all wrong without it */ :root{ --tab-block-margin: var(--proton-tab-block-margin) } :root[uidensity="compact"]{ --tab-block-margin: 2px !important; --proton-tab-block-margin: 2px !important; } /* Modify these to change relative widths or default height */ #navigator-toolbox{ --uc-navigationbar-width: 50vw; --uc-toolbar-height: 40px; } #scrollbutton-up, #scrollbutton-down{ border-block-width: 2px !important; } /* reserved space for overflow + menu buttons */ #navigator-toolbox{ --uc-buttons-width: calc(56px + 4 * var(--toolbarbutton-outer-padding) + var(--uc-menubutton-padding,6px)) } #nav-bar:not([overflowing]) > #nav-bar-customization-target{ --uc-buttons-width: calc(28px + 2 * var(--toolbarbutton-outer-padding) + 6px) } /* Override for other densities */ :root[uidensity="compact"] #navigator-toolbox{ --uc-toolbar-height: 34px; --uc-menubutton-padding: 0px; } :root[uidensity="touch"] #navigator-toolbox{ --uc-toolbar-height: 44px; } :root[uidensity="compact"] #urlbar-container{ --urlbar-container-height: var(--uc-toolbar-height) !important; padding-block: 0 !important; } :root[uidensity="compact"] #urlbar{ --urlbar-toolbar-height: var(--uc-toolbar-height) !important; } /* prevent urlbar overflow on narrow windows */ /* Dependent on how many items are in navigation toolbar ADJUST AS NEEDED */ @media screen and (max-width: 1000px){ #urlbar-container{ min-width:unset !important } } #TabsToolbar{ margin-left: var(--uc-navigationbar-width); --tabs-navbar-shadow-size: 0px; } #tabbrowser-tabs{ --tab-min-height: calc(var(--uc-toolbar-height) - 2 * var(--tab-block-margin,0px)) !important; } /* Need to set background color for selected tab so it can be distinguished from background */ #TabsToolbar .tab-background[selected]{ background: var(--lwt-selected-tab-background-color,rgba(0,0,0,0.2)) !important; } #TabsToolbar[brighttext] .tab-background[selected]{ background: var(--lwt-selected-tab-background-color,rgba(255,255,255,0.2)) !important; } /* This isn't useful when tabs start in the middle of the window */ .titlebar-placeholder[type="pre-tabs"],.titlebar-spacer[type="pre-tabs"]{ width:8px !important} #nav-bar{ margin-top: calc(0px - var(--uc-toolbar-height)); } #nav-bar-customization-target{ margin-right: calc(100vw - (var(--uc-navigationbar-width)) - var(--uc-window-control-width) - var(--uc-buttons-width) - var(--uc-window-drag-space-post)) } @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){ .titlebar-buttonbox-container{ position: fixed; display: blocK; left: 0px; z-index: 3; } #nav-bar-customization-target{ margin-right: calc(100vw - (var(--uc-navigationbar-width)) - var(--uc-buttons-width) - var(--uc-window-drag-space-pre)) } } :root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container, #TabsToolbar > .toolbar-items{ position: relative !important; z-index: 2 } :root[sizemode="fullscreen"] #TabsToolbar > .titlebar-spacer[type="post-tabs"]{ display: -moz-box !important; } .titlebar-placeholder[type="post-tabs"], .titlebar-spacer[type="post-tabs"]{ width: calc(var(--uc-buttons-width) + var(--uc-window-drag-space-post)) !important; } :root[privatebrowsingmode="temporary"] .titlebar-spacer[type="post-tabs"]{ width: var(--uc-buttons-width) !important } #PanelUI-button,#nav-bar-overflow-button{ margin: 0px !important; border: 0px !important; position: relative; z-index: 3; } /* 1px margin on touch density causes tabs to be too high */ .tab-close-button{ margin-top: 0 !important } /* Hide dropdown placeholder */ #urlbar-container:not(:hover) .urlbar-history-dropmarker{ margin-inline-start: -28px; }