vinzenz/hyperhive
vinzenz/hyperhive
Watch
0
0
Fork
You've already forked hyperhive
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

badge: fix quiet-variant regression under an explicit theme override

Browse source 
argus review: the two :root[data-theme='...'] glass-override rules
have specificity 0-3-0 (:root + [data-theme] + .ui-badge), beating
.ui-badge-quiet's 0-1-0 — so whenever a user has an explicit theme
override set (not just relying on prefers-color-scheme), these rules
reintroduced a fill on quiet badges, regressing the settings/links
trigger fix. Scope both overrides with :not(.ui-badge-quiet).

Verified with a real repro (same synthetic striped-bg test page,
before/after) rather than just the specificity arithmetic.
This commit is contained in:
iris 2026-08-29 20:41:27 +02:00 • committed by mara
commit 760e5ad4cc
1 changed files with 11 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

13
frontend/packages/shared/src/badge/Badge.css
View file

@ -42,12 +42,21 @@
backdrop-filter: none;
}
}
:root[data-theme='light'] .ui-badge {
/* `:not(.ui-badge-quiet)` here, unlike the base rule/`@media` block
above — argus's review: both of these add `:root`+`[data-theme]` to
the selector, so specificity is 0-3-0 vs plain `.ui-badge-quiet`'s
0-1-0. Without the exclusion these would beat quiet's `background:
none` (below) whenever a user has an *explicit* theme override set
(SettingsMenu's dropdown, not just the OS default), reintroducing
the settings/links "should not have the badge bg" bug on those
triggers. Verified against a real repro before landing, not just
the specificity arithmetic. */
:root[data-theme='light'] .ui-badge:not(.ui-badge-quiet) {
background: var(--purple-dim);
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
:root[data-theme='dark'] .ui-badge {
:root[data-theme='dark'] .ui-badge:not(.ui-badge-quiet) {
background: color-mix(in srgb, var(--purple-dim) 65%, transparent);
-webkit-backdrop-filter: blur(6px) saturate(140%);
backdrop-filter: blur(6px) saturate(140%);