mirror of
https://github.com/zen-browser/desktop.git
synced 2025-10-02 16:08:41 +00:00
Refactor vertical-tabs.css to enhance tab background styling and improve layout consistency
This commit is contained in:
@@ -280,10 +280,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
&[selected] .tab-background {
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
@media (-moz-bool-pref: 'zen.tabs.dim-pending') {
|
||||
&[pending='true'] .tab-icon-image {
|
||||
opacity: 0.5;
|
||||
@@ -326,13 +322,18 @@
|
||||
/* On essentials, glance tabs are floating */
|
||||
&[zen-essential='true'] .tabbrowser-tab {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
right: 4px;
|
||||
--tab-collapsed-width: 35px;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
--tab-collapsed-width: 34px;
|
||||
--tab-min-height: 16px;
|
||||
width: var(--tab-collapsed-width) !important;
|
||||
z-index: 1;
|
||||
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;
|
||||
}
|
||||
|
||||
#zen-essentials-container .tabbrowser-tab {
|
||||
#zen-essentials-container > .tabbrowser-tab {
|
||||
--toolbarbutton-inner-padding: 0;
|
||||
max-width: unset;
|
||||
width: 100% !important;
|
||||
@@ -994,7 +995,7 @@
|
||||
}
|
||||
|
||||
@media (-moz-bool-pref: 'zen.theme.essentials-favicon-bg') {
|
||||
&[visuallyselected] .tab-background {
|
||||
&[visuallyselected] > .tab-stack > .tab-background {
|
||||
&::after {
|
||||
content: "";
|
||||
inset: -50%;
|
||||
|
Reference in New Issue
Block a user