This change achieves multiple things: * The sizing options for placeholder are in one place * Improves compatibility with other styles * Improves compatibility with other window control placements * Makes fullscreen work * Makes menubar not take any space when disabled Previously, when Firefox did not have :has selector support, we needed to create :hover triggered space to activate menubar, this took some space from toolbar and required special styling to support translucent toolbar background colors. But it was necessary, because otherwise there would have been no way to access menubar items. This still assumes that the user has menubar disabled, but that is fine, because if menubar is enabled, then there is no reason to use this style in the first place.
71 lines
2.0 KiB
CSS
71 lines
2.0 KiB
CSS
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/multi-row_tabs_window_control_patch.css made available under Mozilla Public License v. 2.0
|
|
See the above repository for updates as well as full license text. */
|
|
|
|
/* This is a supporting style for multi-row_tabs.css*/
|
|
/* This depends on window_control_placeholder_support.css to work so get that as well */
|
|
|
|
/* !! Use customize mode to make menubar permanently enabled !! */
|
|
/* You should NOT use this style if you want menubar to just always be visible */
|
|
|
|
/* space on left and right to be able to drag the window */
|
|
:root[sizemode="normal"] #TabsToolbar{
|
|
margin-inline: var(--uc-window-drag-space-pre) var(--uc-window-drag-space-post);
|
|
}
|
|
#nav-bar{
|
|
border-left-width: 0px;
|
|
}
|
|
:root[sizemode="fullscreen"] .titlebar-buttonbox-container{
|
|
display: flex !important;
|
|
}
|
|
:root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container{
|
|
display: none !important;
|
|
}
|
|
#titlebar{
|
|
flex-direction: column-reverse;
|
|
will-change: unset !important;
|
|
opacity: 1 !important;
|
|
}
|
|
#toolbar-menubar{
|
|
height: 40px;
|
|
margin-bottom: -40px;
|
|
display: flex;
|
|
}
|
|
:root[sizemode="fullscreen"] #toolbar-menubar{
|
|
visibility: visible !important;
|
|
}
|
|
:root[uidensity="compact"] #toolbar-menubar{
|
|
height: 32px;
|
|
margin-bottom: -32px;
|
|
}
|
|
#main-menubar{
|
|
height: 100%;
|
|
position: relative;
|
|
justify-content: center !important;
|
|
}
|
|
#main-menubar > menu{
|
|
opacity: 0;
|
|
}
|
|
#main-menubar:has(>[_moz-menuactive]),
|
|
#menubar-items:hover > #main-menubar{
|
|
background-image: linear-gradient( to left,transparent,var(--arrowpanel-background) 35px);
|
|
color: var(--arrowpanel-color);
|
|
background-size: cover;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
#main-menubar:has(>[_moz-menuactive]) > menu{
|
|
opacity: 1;
|
|
}
|
|
#main-menubar:last-child{
|
|
padding-inline-end: 40px;
|
|
}
|
|
#menubar-items:hover{
|
|
z-index: 2;
|
|
}
|
|
#file-menu{
|
|
padding-inline-start: 30px;
|
|
background: url(chrome://browser/skin/settings.svg) no-repeat 10px;
|
|
fill: currentColor;
|
|
-moz-context-properties: fill
|
|
}
|