Fix unreadable white-on-white text when hovering the active identity page tab

The JS toggle set bg-white/text-ink on the newly active tab but never
removed hover:text-white, which was still sitting in that tab's class
list from its inactive state (or, for Identity, added by hovering
while active) -- hovering the active pill turned its own text white
on its own white background.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ECGMEwrc2k4D8VQuwjstj9
This commit is contained in:
2026-08-21 09:39:05 +02:00
parent 5f7ca98eae
commit 20a44a915f

View File

@@ -307,6 +307,11 @@
other.classList.toggle("bg-white", active);
other.classList.toggle("text-ink", active);
other.classList.toggle("text-on-dark", !active);
// Without this, a tab that started active (Identity, server-rendered
// without hover:text-white) or was activated via a click keeps whatever
// hover class its *other* state had -- hovering the active white pill
// would turn its own text white too, unreadable on the white background.
other.classList.toggle("hover:text-white", !active);
});
document.querySelectorAll("[data-page-panel]").forEach((panel) => {
const active = panel.dataset.pagePanel === tab.dataset.pageTab;