From 760e5ad4cc38d2dfc186cd4ad1c4e1170e4b8329 Mon Sep 17 00:00:00 2001
From: iris <iris@hyperhive.local>
Date: Sat, 29 Aug 2026 20:41:27 +0200
Subject: [PATCH] badge: fix quiet-variant regression under an explicit theme
 override
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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.
---
 frontend/packages/shared/src/badge/Badge.css | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/frontend/packages/shared/src/badge/Badge.css b/frontend/packages/shared/src/badge/Badge.css
index e4962545..d1fff96b 100644
--- a/frontend/packages/shared/src/badge/Badge.css
+++ b/frontend/packages/shared/src/badge/Badge.css
@@ -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%);