mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2025-10-02 16:08:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactor vertical-tabs.css to enhance tab background styling and improve layout consistency

Browse Source
This commit is contained in:
mr. M
2025-02-15 01:26:32 +01:00
committed by mr. m
parent 4d364acc1d
commit 8e6b4515ed
1 changed files with 10 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
View File

@@ -280,10 +280,6 @@
} }
} }
&[selected] .tab-background {
backdrop-filter: blur(10px);
}
@media (-moz-bool-pref: 'zen.tabs.dim-pending') { @media (-moz-bool-pref: 'zen.tabs.dim-pending') {
&[pending='true'] .tab-icon-image { &[pending='true'] .tab-icon-image {
opacity: 0.5; opacity: 0.5;
@@ -326,13 +322,18 @@
/* On essentials, glance tabs are floating */ /* On essentials, glance tabs are floating */
&[zen-essential='true'] .tabbrowser-tab { &[zen-essential='true'] .tabbrowser-tab {
position: absolute; position: absolute;
top: 4px; top: 0px;
right: 4px; right: 0px;
--tab-collapsed-width: 35px; --tab-collapsed-width: 34px;
--tab-min-height: 16px; --tab-min-height: 16px;
width: var(--tab-collapsed-width) !important; width: var(--tab-collapsed-width) !important;
z-index: 1; z-index: 1;
pointer-events: none; pointer-events: none;
& .tab-background {
/* Solid colors because we don't want to show the background */
background: light-dark(rgb(249, 249, 249), rgb(63, 63, 63)) !important;
border: 2px solid light-dark(rgba(0, 0, 0, 0.4), rgba(255, 255, 255, 0.4));
}
} }
} }
} }
@@ -954,7 +955,7 @@
padding: 0; padding: 0;
} }
#zen-essentials-container .tabbrowser-tab { #zen-essentials-container > .tabbrowser-tab {
--toolbarbutton-inner-padding: 0; --toolbarbutton-inner-padding: 0;
max-width: unset; max-width: unset;
width: 100% !important; width: 100% !important;
@@ -994,7 +995,7 @@
} }
@media (-moz-bool-pref: 'zen.theme.essentials-favicon-bg') { @media (-moz-bool-pref: 'zen.theme.essentials-favicon-bg') {
&[visuallyselected] .tab-background { &[visuallyselected] > .tab-stack > .tab-background {
&::after { &::after {
content: ""; content: "";
inset: -50%; inset: -50%;