With Fx133 we need to apply transform separately to urlbar, and it seems that doesn't play well with toolbox using margin-top.
44 lines
1.8 KiB
CSS
44 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[style=""],
|
|
#navigator-toolbox:hover,
|
|
#navigator-toolbox:focus-within,
|
|
#mainPopupSet:has(> #appMenu-popup[panelopen="true"]) ~ #navigator-toolbox{
|
|
transition-delay: 0ms !important;
|
|
transform: translateY(0);
|
|
}
|
|
#mainPopupSet:has(> [role="group"][panelopen]) ~ toolbox #urlbar[popover],
|
|
#navigator-toolbox[style=""] #urlbar[popover],
|
|
#urlbar-container > #urlbar[popover]:is([focused],[open]){
|
|
pointer-events: auto;
|
|
opacity: 1;
|
|
transition-delay: 0ms;
|
|
transform: translateY(0);
|
|
}
|
|
}
|
|
} |