/ * Source file https : / / github . com / MrOtherGuy / firefox-csshacks / tree / master / chrome / hide_tabs_with_one_tab . css made available under Mozilla Public License v . 2 . 0
See the above repository for updates as well as full license text . * /
/ * Makes tabs toolbar items zero-height initially and sets enlarge them to fill up space equal to tab-min-height set on tabs . Optionally use privatemode_indicator_as_menu_button . css to replace main menu icon with private browsing indicator while tabs are hidden .
This will NOT work correctly if you have hidden tabs such as with tab groups extensions
* /
/* This style causes CSD window controls to disappear on linux, but you can kind of work around that by using window_control_fallback_for_custom_windows_theme.css */
: root [ sizemode = "normal" ] # nav-bar { --uc-window-drag-space-width : 20 px }
# titlebar { -moz- appearance : none !important ; }
# TabsToolbar { min-height : 0 px !important }
# tabbrowser-tabs ,
# tabbrowser-arrowscrollbox { min-height : 0 !important ; }
. accessibility-indicator ,
. private-browsing-indicator {
height : unset ! important ;
}
. accessibility-indicator > hbox { padding-block : 0 !important }
. tabbrowser-tab {
height : calc ( var ( --tab-min-height ) + 2 * var ( --tab-block-margin , 0px ) ) ;
}
. tabbrowser-tab : only-of-type ,
. tabbrowser-tab [ first-visible-tab = "true" ] [ last-visible-tab = "true" ] {
visibility : collapse ! important ;
min-height : 0 ! important ;
height : 0 ;
}
/* Fix window controls not being clickable */
: root [ tabsintitlebar ] # toolbar-menubar [ autohide = "true" ] [ inactive ] {
transition : height 0ms steps ( 1 ) 80ms ;
}
: where ( # nav-bar ) {
border-inline : var ( --uc-window-drag-space-width , 0 ) solid var ( --toolbar-bgcolor ) ;
}
@ media ( -moz-platform : linux ) {
# TabsToolbar . titlebar-buttonbox {
-moz-box-align : stretch ! important ; /* Fx < 112 compatibility */
align-items : stretch ! important ;
}
# TabsToolbar > . titlebar-buttonbox-container > . titlebar-buttonbox > . titlebar-button {
transform : scale ( 0 . 8 ) ;
margin-inline : -3px ! important ;
}
# TabsToolbar . titlebar-button > . toolbarbutton-icon { padding : 0 13 px !important }
}
# tabbrowser-tabs : not ( [ overflowing = "true" ] ) ~ # alltabs-button {
display : none ;
}
# tabbrowser-arrowscrollbox-periphery ,
# private-browsing-indicator-with-label ,
# TabsToolbar > . titlebar-buttonbox-container {
contain : strict ;
contain-intrinsic-height : 0px ;
}
# tabbrowser-arrowscrollbox-periphery {
contain-intrinsic-width : 36px ;
padding-inline-end : 3px ;
}
# private-browsing-indicator-with-label {
contain-intrinsic-width : 116px ;
}
# TabsToolbar > . titlebar-buttonbox-container {
contain-intrinsic-width : var ( --uc-window-control-width , 138px ) ;
margin-bottom : 0 ! important ;
}
@ media ( -moz-platform : linux ) {
# TabsToolbar > . titlebar-buttonbox-container {
contain-intrinsic-width : var ( --uc-window-control-width , 105px ) ;
}
}
@ media ( -moz-platform : macos ) {
# TabsToolbar > . titlebar-buttonbox-container {
contain-intrinsic-width : var ( --uc-window-control-width , 72px ) ;
}
}