Llevo unas semanas navegando con el Firefox a pantalla completa para tratar de acostumbrarme, ya que en unos días voy a disfrutar de una pantalla OLED y, como paso gran parte del tiempo en el navegador, tenerlo a pantalla completa es muy buena idea para evitar quemados, ya que así no hay ningún elemento fijo durante mucho tiempo (barra de tareas, pestañas, barra de herramientas,controles de la ventana, etc.).
El caso es que el comportamiento del navegador me estaba volviendo loco por algo que hace realmente molesto y que parece ser que es común a otros navegadores. Me refiero a lo que pasa al activar los menús de arriba al mover el ratón a la parte superior de la pantalla para ver las pestañas o acceder a la barra de direcciones o a los iconos de las extensiones, etc. Dicha área aparece y mueve todo el contenido de la web que estés viendo hacia abajo para no solaparla. Eso, que parece bastante lógico, es un dolor de ojos y de cabeza en cuando lo haces unas cuentas veces.
El caso es que buscando por Internet he encontrado la solución para que dicho menú solape el contenido del navegador y ¡funciona de maravilla!. Os lo explico por si os es de interés.
Lo primero es acceder a la configuración del navegador con about:config.
Allí pegamos toolkit.legacyUserProfileCustomizations.stylesheets y lo cambiamos a true. Eso hará que Firefox cargue al iniciarse el estilo que vamos a crear.
Luego entramos en about:support y donde pone Carpeta de perfil pinchamos en Abrir carpeta. Eso abre el directorio de nuestro perfil de Firefox.
Allí si no existe la carpeta Chrome, la creamos. Dentro creamos un fichero llamado userChrome.css con el contenido que pego al final.
Reiniciamos el navegador.
Para hacer que Firefox se inicie siempre a pantalla completa podemos usar la extensión llamada ForceFull.
Bien y creo que eso es todo. No sé si me he olvidado de algo. Ya me lo decís si queréis probarlo.
Contenido del userChrome.css:
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_toolbox.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */
/* Hide the whole toolbar area unless urlbar is focused or cursor is over the toolbar
* Dimensions on non-Win10 OS probably needs to be adjusted.
*/
:root{
--uc-autohide-toolbox-delay: 100ms; /* Wait 0.1s before hiding toolbars */
--uc-toolbox-rotation: 82deg; /* This may need to be lower on mac - like 75 or so */
}
:root[sizemode="maximized"]{
--uc-toolbox-rotation: 88.5deg;
}
@media (-moz-platform: windows){
:root:not([lwtheme]) #navigator-toolbox{ background-color: -moz-dialog !important; }
}
:root[sizemode="fullscreen"],
:root[sizemode="fullscreen"] #navigator-toolbox{ margin-top: 0 !important; }
#navigator-toolbox{
--browser-area-z-index-toolbox: 3;
position: fixed !important;
background-color: var(--lwt-accent-color,black) !important;
transition: transform 82ms linear, opacity 82ms linear !important;
transition-delay: var(--uc-autohide-toolbox-delay) !important;
transform-origin: top;
transform: rotateX(var(--uc-toolbox-rotation));
opacity: 0;
line-height: 0;
z-index: 1;
pointer-events: none;
}
:root[sessionrestored] #urlbar[popover]{
pointer-events: none;
opacity: 0;
transition: transform 82ms linear var(--uc-autohide-toolbox-delay), opacity 0ms calc(var(--uc-autohide-toolbox-delay) + 82ms);
transform-origin: 0px calc(0px - var(--tab-min-height) - var(--tab-block-margin) * 2);
transform: rotateX(89.9deg);
}
#mainPopupSet:has(> [panelopen]:not(#ask-chat-shortcuts,#tab-preview-panel)) ~ toolbox #urlbar[popover],
#navigator-toolbox:is(:hover,:focus-within) #urlbar[popover],
#urlbar-container > #urlbar[popover]:is([focused],[open]){
pointer-events: auto;
opacity: 1;
transition-delay: 33ms;
transform: rotateX(0deg);
}
#mainPopupSet:has(> [panelopen]:not(#ask-chat-shortcuts,#tab-preview-panel)) ~ toolbox,
#navigator-toolbox:has(#urlbar:is([open],[focus-within])),
#navigator-toolbox:hover,
#navigator-toolbox:focus-within{
transition-delay: 33ms !important;
transform: rotateX(0);
opacity: 1;
}
/* This makes things like OS menubar/taskbar show the toolbox when hovered in maximized windows.
* Unfortunately it also means that other OS native surfaces (such as context menu on macos)
* and other always-on-top applications will trigger toolbox to show up. */
@media (-moz-bool-pref: "userchrome.autohide-toolbox.unhide-by-native-ui.enabled"){
:root[sizemode="maximized"]:not(:hover){
#navigator-toolbox:not(:-moz-window-inactive),
#urlbar[popover]:not(:-moz-window-inactive){
transition-delay: 33ms !important;
transform: rotateX(0);
opacity: 1;
}
}
}
#navigator-toolbox > *{ line-height: normal; pointer-events: auto }
#navigator-toolbox,
#navigator-toolbox > *{
width: 100vw;
-moz-appearance: none !important;
}
/* These two exist for oneliner compatibility */
#nav-bar{ width: var(--uc-navigationbar-width,100vw) }
#TabsToolbar{ width: calc(100vw - var(--uc-navigationbar-width,0px)) }
/* Don't apply transform before window has been fully created */
:root:not([sessionrestored]) #navigator-toolbox{ transform:none !important }
:root[customizing] #navigator-toolbox{
position: relative !important;
transform: none !important;
opacity: 1 !important;
}
#navigator-toolbox[inFullscreen] > #PersonalToolbar,
#PersonalToolbar[collapsed="true"]{ display: none }
/* Uncomment this if tabs toolbar is hidden with hide_tabs_toolbar.css */
/*#titlebar{ margin-bottom: -9px }*/
/* Uncomment the following for compatibility with tabs_on_bottom.css - this isn't well tested though */
/*
#navigator-toolbox{ flex-direction: column; display: flex; }
#titlebar{ order: 2 }
*/
