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:
@@ -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;
|
||||
|
||||
Reference in New Issue
Block a user