From e24386276950545d53bed86e4597be89e61eb0b8 Mon Sep 17 00:00:00 2001 From: Martin Bauer Date: Sun, 13 Sep 2026 00:21:34 +0200 Subject: [PATCH] Fix barely-visible music-note tab icon The glass-bar redesign dropped the explicit icon color, so inactive icons fell back to the browser's default text color - fine for icons that render as full-color emoji, but the music note apparently renders as a plain glyph on at least one platform, making it nearly invisible against the bar's near-white glass background. Set it explicitly. Co-Authored-By: Claude Sonnet 5 --- web/src/components/TabRail.tsx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/web/src/components/TabRail.tsx b/web/src/components/TabRail.tsx index e3d696e..a1dc389 100644 --- a/web/src/components/TabRail.tsx +++ b/web/src/components/TabRail.tsx @@ -60,10 +60,15 @@ export function TabRail({ page, onSelect, showRoom }: Props) { border: "none", borderRadius: 999, background: active ? "var(--accent)" : "transparent", + // Explicit, not inherited: at least one of these icons (the music note) + // renders as a plain glyph rather than full-color on some platforms, and + // without this it fell back to the browser's default text colour - too + // close to the glass bar's own near-white background to read. + color: active ? "#fff" : "var(--ink)", fontSize: 20, fontWeight: 900, cursor: "pointer", - transition: "background 0.15s ease", + transition: "background 0.15s ease, color 0.15s ease", }} > {PAGE_ICON[candidate]}