diff --git a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css index 286493476..7f0312f38 100644 --- a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css +++ b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css @@ -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%;