make autohide_menubar and toolbars_below_content work together
This change adds a few variables to both styles that "communicate" with each other. This autohide_menubar is pretty useful if toolbars are below content so while this does introduce complexity, it's probably worth it.
This commit is contained in:
parent
2cea8f0710
commit
bbcea9a26f
2 changed files with 26 additions and 24 deletions
|
@ -1,10 +1,13 @@
|
||||||
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_menubar.css made available under Mozilla Public License v. 2.0
|
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_menubar.css made available under Mozilla Public License v. 2.0
|
||||||
See the above repository for updates as well as full license text. */
|
See the above repository for updates as well as full license text. */
|
||||||
|
|
||||||
/* Makes menubar behave like on mac */
|
/* Makes menubar slide over tabs toolbar when hovered */
|
||||||
/* Menubar will be shown when cursor touches top of the spacers on both side of tabs. Window controls will be in menubar, so they are automatically hidden */
|
/* Menubar will be shown when cursor touches top of the spacers on both side of tabs. Window controls will be in menubar, so they are automatically hidden */
|
||||||
/* Make sure you have menubar enabled */
|
/* Make sure you have menubar enabled */
|
||||||
|
|
||||||
|
:root{ --uc-menubar-spacer: 6px }
|
||||||
|
:root[sizemode="maximized"]{ --uc-menubar-spacer: 1px }
|
||||||
|
|
||||||
#nav-bar-customization-target,
|
#nav-bar-customization-target,
|
||||||
#PanelUI-button,
|
#PanelUI-button,
|
||||||
#nav-bar-overflow-button,
|
#nav-bar-overflow-button,
|
||||||
|
@ -22,7 +25,8 @@ See the above repository for updates as well as full license text. */
|
||||||
display: flex;
|
display: flex;
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
height: var(--uc-menubar-height);
|
height: var(--uc-menubar-height);
|
||||||
margin-top: calc(8px - var(--uc-menubar-height));
|
/* --uc-menubar-extra-margin is defined in toolbars_below_content.css */
|
||||||
|
margin-top: calc(var(--uc-menubar-spacer) - var(--uc-menubar-height) + var(--uc-menubar-extra-margin,0px));
|
||||||
transition: margin-top 150ms linear !important;
|
transition: margin-top 150ms linear !important;
|
||||||
-moz-window-dragging: no-drag;
|
-moz-window-dragging: no-drag;
|
||||||
z-index:4;
|
z-index:4;
|
||||||
|
@ -30,7 +34,7 @@ See the above repository for updates as well as full license text. */
|
||||||
|
|
||||||
#toolbar-menubar:hover{
|
#toolbar-menubar:hover{
|
||||||
background-color: var(--toolbar-bgcolor) !important;
|
background-color: var(--toolbar-bgcolor) !important;
|
||||||
margin-top: 0px;
|
margin-top: var(--uc-menubar-extra-margin,0px) !important;
|
||||||
z-index: 6
|
z-index: 6
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -6,10 +6,13 @@ See the above repository for updates as well as full license text. */
|
||||||
/* By default, menubar will stay on top with two options to select it's behavior - see below */
|
/* By default, menubar will stay on top with two options to select it's behavior - see below */
|
||||||
|
|
||||||
@-moz-document url(chrome://browser/content/browser.xhtml){
|
@-moz-document url(chrome://browser/content/browser.xhtml){
|
||||||
|
|
||||||
#titlebar{ -moz-appearance: none !important; }
|
#titlebar{ -moz-appearance: none !important; }
|
||||||
|
|
||||||
@media (-moz-os-version: windows-win10){
|
@media (-moz-os-version: windows-win10){
|
||||||
|
/* Next two variables are used by autohide_menubar.css */
|
||||||
|
#toolbar-menubar{ --uc-menubar-extra-margin: 0px }
|
||||||
|
:root[sizemode="maximized"] #toolbar-menubar{ --uc-menubar-extra-margin: 8px }
|
||||||
|
|
||||||
:root[sizemode="maximized"][tabsintitlebar] :where(#browser,#customization-container,#toolbar-menubar){ margin-top: 8px }
|
:root[sizemode="maximized"][tabsintitlebar] :where(#browser,#customization-container,#toolbar-menubar){ margin-top: 8px }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -44,30 +47,25 @@ See the above repository for updates as well as full license text. */
|
||||||
/* These two rules exist for compatibility with autohide_toolbox.css */
|
/* These two rules exist for compatibility with autohide_toolbox.css */
|
||||||
#navigator-toolbox{ bottom: -1px; transform-origin: bottom }
|
#navigator-toolbox{ bottom: -1px; transform-origin: bottom }
|
||||||
|
|
||||||
|
#toolbar-menubar{ z-index: 1; background-color: var(--lwt-accent-color,black); }
|
||||||
|
|
||||||
/**************
|
/**************
|
||||||
Menubar options
|
Menubar options - By default, menubar is overlayed on top of web-content
|
||||||
***************/
|
***************/
|
||||||
|
|
||||||
/* Activate only ONE of the following */
|
/* Uncomment the following if you want static menubar on top of the window (make menubar enabled)
|
||||||
|
* Use when menubar is enabled to always show it */
|
||||||
/* 1. Overlay menubar on top of web-content (default) */
|
|
||||||
/* This should be used if menubar is disabled and Alt-key is used to activate it temporarily */
|
|
||||||
|
|
||||||
#toolbar-menubar{ z-index: 1; background-color: var(--lwt-accent-color,black) }
|
|
||||||
|
|
||||||
/* 2. Static menubar on top of the window, uncomment to enable this option */
|
|
||||||
/* Use when menubar is enabled to always show it */
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
#browser,#customization-container{ padding-top: 28px }
|
#browser,#customization-container{ padding-top: var(--uc-menubar-spacer,28px) }
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* 3. Menubar below content, above tabs toolbar */
|
/* OR, if uncomment the following if you want menubar to appear below content, above tabs toolbar */
|
||||||
|
|
||||||
/*
|
/*
|
||||||
#toolbar-menubar{ position: static; display: -moz-box; margin-top: 0px !important; }
|
#toolbar-menubar{ position: static; display: -moz-box; margin-top: 0px !important; background-color: transparent }
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* set to "reverse" (without quotes) if you want tabs above menubar with option 3 */
|
/* set to "reverse" (without quotes) if you want tabs above menubar with the above option */
|
||||||
#titlebar{ -moz-box-direction: normal; }
|
#titlebar{ -moz-box-direction: normal; }
|
||||||
|
|
||||||
}
|
}
|
Loading…
Reference in a new issue