/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_bookmarks_and_main_toolbars.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ #navigator-toolbox{ --uc-bm-padding: 4px; /* Vertical padding to be applied to bookmarks */ --uc-bm-height: calc(20px + 2 * var(--uc-bm-padding)); /* Might need to adjust if the toolbar has other buttons */ --uc-navbar-height: -40px; /* navbar is main toolbar. Use negative value */ --uc-autohide-toolbar-delay: 600ms; /* The toolbar is hidden after 0.6s */ } :root[uidensity="compact"] #navigator-toolbox{ --uc-navbar-height: -34px; } :root[uidensity="touch"] #navigator-toolbox{ --uc-bm-padding: 6px } :root[chromehidden~="directories"] #navigator-toolbox{ --uc-bm-height: 0px; } :root[chromehidden~="toolbar"] #navigator-toolbox{ --uc-navbar-height: 0px; } :root[sessionrestored] #nav-bar, :root[sessionrestored] #PersonalToolbar{ background-image: linear-gradient(var(--toolbar-bgcolor),var(--toolbar-bgcolor)), var(--lwt-additional-images,var(--toolbar-bgimage)) !important; background-position: top,var(--lwt-background-alignment); background-position-y: calc(0px - var(--tab-min-height) - 2*var(--tab-block-margin,0px)); background-repeat: repeat,var(--lwt-background-tiling); transform: rotateX(90deg); transform-origin: top; transition: transform 135ms linear var(--uc-autohide-toolbar-delay) !important; z-index: 2; } #PlacesToolbarItems > .bookmark-item, #OtherBookmarks, #PersonalToolbar > #import-button{ padding-block: var(--uc-bm-padding) !important; } :root[sessionrestored] #PersonalToolbar{ z-index: 1; background-position-y: calc(0px - var(--tab-min-height) - 2*var(--tab-block-margin,0px) + var( --uc-navbar-height)); } :root[lwtheme-image] #nav-bar, :root[lwtheme-image] #PersonalToolbar{ background-image: linear-gradient(var(--toolbar-bgcolor),var(--toolbar-bgcolor)),var(--lwt-header-image), var(--lwt-additional-images,var(--toolbar-bgimage)) !important; } #nav-bar[customizing],#PersonalToolbar[customizing]{ transform: none !important } #navigator-toolbox > #PersonalToolbar{ transform-origin: 0px var(--uc-navbar-height); position: relative; } :root[sessionrestored]:not([customizing]) #navigator-toolbox{ margin-bottom: calc(-1px - var(--uc-bm-height) + var(--uc-navbar-height)); } /* Make sure the bookmarks toolbar is never collapsed even if it is disabled */ :root[sizemode="fullscreen"] #PersonalToolbar, #PersonalToolbar[collapsed="true"]{ min-height: initial !important; max-height: initial !important; visibility: hidden !important } #PersonalToolbar[collapsed="true"] #PlacesToolbarItems > *, :root[sizemode="fullscreen"] #PersonalToolbar #PlacesToolbarItems > *{ visibility: hidden !important; } /* If bookmarks toolbar is collapsed on startup, then no items are generated, and we need to set some height for it */ #PlacesToolbarItems:empty{ height: var(--uc-bm-height); } /* Selected tab needs higher z-index now to "hide" the broder below it */ .tabbrowser-tab[selected]{ z-index: 3 !important; } /* Show when cursor is over main menu popup - this requires :has selector support */ #mainPopupSet:has(> #appMenu-popup:hover) ~ toolbox > .browser-toolbar{ transition-delay: 100ms !important; transform: rotateX(0); } /* SELECT TOOLBAR BEHAVIOR */ /* Comment out or delete one of these to disable that behavior */ /* Show when urlbar is focused */ #nav-bar:focus-within + #PersonalToolbar, #navigator-toolbox > #nav-bar:focus-within{ transition-delay: 100ms !important; transform: rotateX(0); } /* Show when cursor is over the toolbar area */ #navigator-toolbox:hover > .browser-toolbar{ transition-delay: 100ms !important; transform: rotateX(0); } /* This ruleset is separate, because not having :has support breaks other selectors as well */ #mainPopupSet:has(> #appMenu-popup:hover) ~ #navigator-toolbox > .browser-toolbar{ transition-delay: 33ms !important; transform: rotateX(0); } /* This makes the tab notification box show immediately below tabs, otherwise it would break the layout */ #navigator-toolbox > div{ display: contents } :where(#titlebar,#tab-notification-deck,.global-notificationbox){ order: -1; } :root[BookmarksToolbarOverlapsBrowser] #navigator-toolbox{ margin-bottom: calc(-1px - var(--uc-bm-height) + var(--uc-navbar-height)) !important; z-index: auto !important; } @media (-moz-bool-pref: "browser.fullscreen.autohide"){ :root[sizemode="fullscreen"] #navigator-toolbox[style*="margin-top"]{ margin-top: calc(1px - var(--tab-min-height) - 2 * var(--tab-block-margin)) !important; } } /* Set the following pref to enable compatibility with multi-row_bookmarks.css */ @media (-moz-bool-pref: "userchrome.autohide-bm-and-main-toolbars.multirow-bookmarks-compat.enabled"){ #navigator-toolbox{ margin-bottom: var(--uc-navbar-height) !important; } #PersonalToolbar:not([customizing]){ min-height: 0 !important; margin-bottom: 0; height: 0; overflow-y: visible !important; z-index: 2; padding-inline: 0 !important; } #personal-bookmarks{ background: inherit; height: min-content; } #PlacesToolbarDropIndicatorHolder{ pointer-events: none !important; } }