Files
firefox-csshacks/chrome/overlay_fullscreen_toolbars.css
MrOtherGuy 890a03f4ff autohiding toolbars: exclude tab-preview-panel from keeping toolbar open
Tab preview panel can sometimes cause what is possibly style
invalidation problem where the panel would jump around and even be
outside the window. This is especially likely to happen with
autohide_main_toolbar when tabs are overflowing.
2024-12-09 11:53:29 +02:00

42 lines
1.8 KiB
CSS

/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/overlay_fullscreen_toolbars.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
/* Makes toolbars appear as overlay instead of pushing down the website in fullscreen mode */
@media (-moz-bool-pref: "browser.fullscreen.autohide"){
:root{
--uc-fullscreen-overlay-duration: 82ms;
--uc-fullscreen-overlay-delay: 600ms;
}
:root[sizemode="fullscreen"]{
&[sessionrestored]{
#urlbar[popover]{
pointer-events: none;
opacity: 0;
transition: transform var(--uc-fullscreen-overlay-duration) ease-in-out var(--uc-fullscreen-overlay-delay), opacity 0ms calc(var(--uc-fullscreen-overlay-delay) + 82ms);
transform: translateY(calc(0px - var(--tab-min-height) - (var(--tab-block-margin) * 2) - var(--urlbar-container-height)));
}
}
#navigator-toolbox{
position: fixed !important;
width: 100vw;
z-index: 10 !important;
transition: transform var(--uc-fullscreen-overlay-duration) ease-in-out var(--uc-fullscreen-overlay-delay) !important;
margin-top: 0 !important;
transform: translateY(-100%);
}
#navigator-toolbox:is(:hover,:focus-within,[style=""]),
#mainPopupSet:has(> [panelopen]:not(#ask-chat-shortcuts,#tab-preview-panel)) ~ #navigator-toolbox{
transition-delay: 0ms !important;
transform: translateY(0);
}
#mainPopupSet:has(> [panelopen]:not(#ask-chat-shortcuts,#tab-preview-panel)) ~ toolbox #urlbar[popover],
#navigator-toolbox:is(:hover,:focus-within,[style=""]) #urlbar[popover],
#urlbar-container > #urlbar[popover]:is([focused],[open]){
pointer-events: auto;
opacity: 1;
transition-delay: 0ms;
transform: translateY(0);
}
}
}