fix: remove dark:text-ivory to enforce high contrast white text on active vermillion badge in all themes

This commit is contained in:
2026-07-30 22:41:16 +09:00
parent 43c75daec6
commit 40b252b10b
+10 -8
View File
@@ -64,20 +64,20 @@ export default function Header() {
key={item.href} key={item.href}
href={item.href} href={item.href}
aria-current={active ? "page" : undefined} aria-current={active ? "page" : undefined}
className={`group relative flex items-baseline gap-1.5 text-[0.78rem] font-semibold uppercase tracking-[0.18em] transition-all px-3 py-1.5 rounded-md ${ className={`group relative flex items-baseline gap-1.5 text-[0.78rem] font-bold uppercase tracking-[0.18em] transition-all px-3.5 py-1.5 rounded-md ${
active active
? "bg-vermillion text-white shadow-sm dark:text-ivory font-bold" ? "bg-vermillion text-white shadow-sm"
: "text-ink hover:text-vermillion hover:bg-paper/60" : "text-ink hover:text-vermillion hover:bg-paper/60"
}`} }`}
> >
<span <span
className={`font-display text-[0.62rem] ${ className={`font-display text-[0.62rem] ${
active ? "text-white dark:text-ivory" : "text-ink-mute" active ? "text-white/90" : "text-ink-mute"
}`} }`}
> >
{item.no} {item.no}
</span> </span>
<span>{item.en}</span> <span className={active ? "text-white" : ""}>{item.en}</span>
</Link> </Link>
); );
})} })}
@@ -126,23 +126,25 @@ export default function Header() {
aria-current={active ? "page" : undefined} aria-current={active ? "page" : undefined}
className={`flex items-baseline justify-between px-4 py-3.5 transition-colors rounded-md my-1 ${ className={`flex items-baseline justify-between px-4 py-3.5 transition-colors rounded-md my-1 ${
active active
? "bg-vermillion text-white font-bold dark:text-ivory shadow-sm" ? "bg-vermillion text-white font-bold shadow-sm"
: "text-ink hover:bg-paper/60" : "text-ink hover:bg-paper/60"
}`} }`}
> >
<span className="flex items-baseline gap-3"> <span className="flex items-baseline gap-3">
<span <span
className={`font-display text-xs ${ className={`font-display text-xs ${
active ? "text-white dark:text-ivory" : "text-ink-mute" active ? "text-white/90" : "text-ink-mute"
}`} }`}
> >
{item.no} {item.no}
</span> </span>
<span className="headline-ko text-lg">{item.ko}</span> <span className={`headline-ko text-lg ${active ? "text-white" : ""}`}>
{item.ko}
</span>
</span> </span>
<span <span
className={`text-[0.7rem] font-semibold uppercase tracking-[0.18em] ${ className={`text-[0.7rem] font-semibold uppercase tracking-[0.18em] ${
active ? "text-white dark:text-ivory" : "text-ink-mute" active ? "text-white/90" : "text-ink-mute"
}`} }`}
> >
{item.en} {item.en}