/ * Source file https : / / github . com / MrOtherGuy / firefox-csshacks / tree / master / chrome / autohide_main_toolbar . css made available under Mozilla Public License v . 2 . 0
See the above repository for updates as well as full license text . * /
/* This style hides the main toolbar and shows it when the cursor is over the tabs toolbar as well as whenever the focus is inside nav-bar, such as when urlbar is focused. */
: root { --uc-navbar-transform : -40 px }
: root [ uidensity = "compact" ] { --uc-navbar-transform : -34 px }
# navigator-toolbox > div { display : contents ; }
: root [ sessionrestored ] : where ( # nav-bar , # PersonalToolbar , # tab-notification-deck , . global-notificationbox ) {
transform : translateY ( var ( --uc-navbar-transform ) )
}
: root : is ( [ customizing ] , [ chromehidden * = "toolbar" ] ) : where ( # nav-bar , # PersonalToolbar , # tab-notification-deck , . global-notificationbox ) {
transform : none ! important ;
opacity : 1 ! important ;
}
# nav-bar : not ( [ customizing ] ) {
opacity : 0 ;
transition : transform 400ms ease 1 . 8s , opacity 400ms ease 1 . 8s ! important ;
position : relative ;
z-index : 2 ;
}
# TabsToolbar { position : relative ; z-index : 3 }
/* Show when toolbox is focused, like when urlbar has received focus */
# navigator-toolbox : focus-within > . browser-toolbar {
transform : translateY ( 0 ) ;
opacity : 1 ;
transition-duration : 500ms , 200ms ! important ;
transition-delay : 0s ! important ;
}
/* Show when toolbox is hovered */
# titlebar : hover ~ . browser-toolbar ,
# nav-bar : hover ,
# nav-bar : hover + # PersonalToolbar {
transform : translateY ( 0 ) ;
opacity : 1 ;
transition-duration : 500ms , 200ms ! important ;
transition-delay : 0s ! important ;
}
/* 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 : translateY ( 0 ) ;
opacity : 1 ;
}
/* Bookmarks toolbar needs so extra rules */
# PersonalToolbar { transition : transform 400 ms ease 1.8 s !important ; position : relative ; z-index : 1 }
/* Move up the content view */
: root [ sessionrestored ] : not ( [ inFullscreen ] , [ chromehidden ~ = "toolbar" ] ) > body > # browser { margin-top : var ( - - uc - navbar - transform ) ; }