tm24fan8/firefox-csshacks
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add background to toolbars

Browse Source 
Because the toolbox has display: contents, we need to display the background
separately for each toolbars. In addtion, on linux the main-window has
transparent background-color so we need to set toolbar opacity to 1 to
prevent transparent window areas.
This commit is contained in:
MrOtherGuy
2024-12-27 14:49:29 +02:00
parent 9987cdb464
commit 0803a042a2
1 changed files with 35 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
chrome/toolbars_below_content_v2.css
View File

@@ -8,6 +8,10 @@ See the above repository for updates as well as full license text. */
#navigator-toolbox{
display: contents;
--uc-navbar-height: 40px;
}
:root[uidensity="compact"] #navigator-toolbox{
--uc-navbar-height: 34px;
}
#main-window > body > #browser,
.global-notificationbox,
@@ -15,9 +19,40 @@ See the above repository for updates as well as full license text. */
#toolbar-menubar{
order: -1;
}
#TabsToolbar{
max-height: calc((var(--tab-min-height) + 2 * var(--tab-block-margin,0px)) * var(--multirow-n-rows,1));
}
#toolbar-menubar,
#TabsToolbar{
background: inherit !important;
}
@media (-moz-platform: linux){
:root[sizemode="normal"][customtitlebar] #toolbar-menubar{
border-top-left-radius: inherit;
border-top-right-radius: inherit;
}
#toolbar-menubar,
#TabsToolbar{
opacity: 1 !important;
will-change: unset !important;
}
}
#nav-bar,
#PersonalToolbar{
background-image: linear-gradient(var(--toolbar-bgcolor),var(--toolbar-bgcolor)), var(--lwt-additional-images,var(--toolbar-bgimage)) !important;
background-position: top,var(--lwt-background-alignment);
background-position-y: calc(0px - var(--tab-min-height) - 2*var(--tab-block-margin,0px));
background-repeat: repeat,var(--lwt-background-tiling);
}
:root[lwtheme-image] #nav-bar,
:root[lwtheme-image] #PersonalToolbar{
background-image: linear-gradient(var(--toolbar-bgcolor),var(--toolbar-bgcolor)),var(--lwt-header-image), var(--lwt-additional-images,var(--toolbar-bgimage)) !important;
}
#PersonalToolbar{
background-position-y: calc(0px - var(--tab-min-height) - 2*var(--tab-block-margin,0px) - var( --uc-navbar-height));
}
#urlbar[breakout][breakout-extend]{
display: flex !important;
flex-direction: column-reverse !important;