fix: enforce semantic contrast across admin
Local Build and Deploy / deploy (push) Successful in 44s

This commit is contained in:
Simo committed 2026-07-12 15:14:15 +02:00
1 parent 45c8178cfa
commit f0b4bc1630
86 files changed
+438 -338

No files matched your search

+9 -9
View File
@@ -170,17 +170,17 @@ async function Sidebar({ staff }: { staff: { id: number; username: string; rank:
const navGroups = getNavGroups(t);
return (
<aside className="sticky top-0 self-start h-screen bg-gradient-to-b from-[#1e1b2e] to-[#151226] text-[#c8cbe0] shadow-xl flex flex-col">
<div className="flex items-center gap-3 px-4 py-5 border-b border-white/[0.06]">
<aside className="sticky top-0 self-start h-screen bg-[var(--admin-sidebar-background)] text-[var(--admin-sidebar-text-readable)] shadow-xl flex flex-col">
<div className="flex items-center gap-3 px-4 py-5 border-b border-[var(--border-subtle)]">
<span
className="flex-none w-10 h-10 rounded-xl grid place-items-center font-extrabold text-base text-[#1a1a2e] bg-gradient-to-br from-[var(--color-primary)] to-[var(--color-primary-hover)] shadow-lg shadow-[var(--color-primary)]/20"
className="flex-none w-10 h-10 rounded-xl grid place-items-center font-extrabold text-base text-[var(--color-primary-foreground-readable)] bg-[var(--color-primary)] shadow-lg shadow-[var(--color-primary)]/20"
aria-hidden
>
{initial}
</span>
<div className="min-w-0 flex-1">
<div className="font-semibold text-sm text-white truncate">{staff.username}</div>
<span className="inline-block mt-0.5 text-[0.6rem] font-bold uppercase tracking-widest text-[rgba(200,203,224,0.5)]">
<div className="font-semibold text-sm text-[var(--admin-sidebar-text-readable)] truncate">{staff.username}</div>
<span className="inline-block mt-0.5 text-[0.6rem] font-bold uppercase tracking-widest text-[var(--admin-sidebar-muted-readable)]">
{t("rankLabel", { rank: staff.rank })}
</span>
</div>
@@ -189,7 +189,7 @@ async function Sidebar({ staff }: { staff: { id: number; username: string; rank:
<nav className="flex-1 overflow-y-auto px-3 py-4 space-y-1">
{navGroups.map((group) => (
<div key={group.label}>
<div className="flex items-center gap-1.5 px-2 py-2 text-[0.6rem] font-bold uppercase tracking-[0.12em] text-[rgba(200,203,224,0.3)]">
<div className="flex items-center gap-1.5 px-2 py-2 text-[0.6rem] font-bold uppercase tracking-[0.12em] text-[var(--admin-sidebar-muted-readable)]">
{group.icon}
<span>{group.label}</span>
</div>
@@ -204,10 +204,10 @@ async function Sidebar({ staff }: { staff: { id: number; username: string; rank:
))}
</nav>
<div className="px-3 py-3 border-t border-white/[0.06]">
<div className="px-3 py-3 border-t border-[var(--border-subtle)]">
<Link
href="/"
className="flex items-center gap-2.5 px-2.5 py-2 rounded-lg text-[#c8cbe0]/60 text-xs font-medium hover:text-white hover:bg-white/5 transition-all duration-150 no-underline"
className="flex items-center gap-2.5 px-2.5 py-2 rounded-lg text-[var(--admin-sidebar-muted-readable)] text-xs font-medium hover:text-[var(--admin-sidebar-text-readable)] hover:bg-[var(--color-primary)]/10 transition-all duration-150 no-underline"
>
<LogOut size={14} />
<span>{t("backToSite")}</span>
@@ -233,7 +233,7 @@ async function Topbar({ staff }: { staff: { id: number; username: string; rank:
<span className="text-xs text-[var(--color-text-muted)]">
<strong className="text-[var(--color-text)]">{staff.username}</strong>
</span>
<span className="inline-flex items-center gap-1.5 text-[0.6rem] font-bold uppercase tracking-wider text-[#1a1a2e] bg-[var(--color-primary)] rounded-full px-2.5 py-1">
<span className="inline-flex items-center gap-1.5 text-[0.6rem] font-bold uppercase tracking-wider text-[var(--color-primary-foreground-readable)] bg-[var(--color-primary)] rounded-full px-2.5 py-1">
{t("rankLabel", { rank: staff.rank })}
</span>
</div>