perf: change the DA to something more readable

This commit is contained in:
Pierre Ryssen
2026-03-11 12:26:45 +01:00
parent cd15c81b53
commit 9642f2511a
22 changed files with 136 additions and 120 deletions

View File

@@ -31,18 +31,17 @@ export default function Sidebar() {
};
return (
<aside className="fixed left-0 top-0 h-screen w-56 bg-[#0a0d0f] border-r border-[#1a2a1a] flex flex-col z-50">
<aside className="fixed left-0 top-0 h-screen w-56 bg-wy-dark border-r border-wy-border flex flex-col z-50">
{/* Logo */}
<div className="flex items-center gap-3 px-5 py-6 border-b border-[#1a2a1a]">
<div className="flex items-center gap-3 px-5 py-6 border-b border-wy-border">
<DragonEye size={32} />
<div>
<div className="text-[8px] font-mono tracking-[0.3em] text-[#4aff8c]/40 uppercase">Analytics</div>
<div className="text-[8px] font-mono tracking-[0.3em] text-acid-green/60 uppercase">Analytics</div>
<div className="text-base font-black tracking-widest text-white">WYVIEW</div>
</div>
</div>
{/* Nav */}
<nav className="flex-1 px-3 py-4 flex flex-col gap-1">
{nav.map(({ label, href, icon: Icon }) => {
const active = pathname === href;
@@ -50,28 +49,27 @@ export default function Sidebar() {
<button
key={href}
onClick={() => router.push(href)}
className={`w-full flex items-center gap-3 px-3 py-2.5 rounded-sm text-left transition-all duration-150 group ${
className={`w-full flex items-center gap-3 px-3 py-2.5 rounded-md text-left transition-all duration-150 group ${
active
? "bg-[#4aff8c]/8 border border-[#4aff8c]/20 text-[#4aff8c]"
: "border border-transparent text-[#4a6a4a] hover:text-[#a0c4a0] hover:bg-white/[0.03]"
? "bg-acid-green/10 border border-acid-green/30 text-acid-green"
: "border border-transparent text-wy-text-secondary hover:text-wy-text-primary hover:bg-white/[0.04]"
}`}
>
<Icon size={14} className="flex-shrink-0" />
<span className="text-[11px] font-mono tracking-wider">{label}</span>
{active && <span className="ml-auto w-1 h-1 rounded-full bg-[#4aff8c]" />}
<Icon size={16} className="flex-shrink-0" />
<span className="text-sm font-medium">{label}</span>
{active && <span className="ml-auto w-1.5 h-1.5 rounded-full bg-acid-green" />}
</button>
);
})}
</nav>
{/* Footer */}
<div className="px-3 py-4 border-t border-[#1a2a1a]">
<div className="px-3 py-4 border-t border-wy-border">
<button
onClick={handleLogout}
className="w-full flex items-center gap-3 px-3 py-2.5 rounded-sm text-[#3a5a3a] hover:text-red-400 hover:bg-red-500/5 border border-transparent hover:border-red-500/20 transition-all duration-150"
className="w-full flex items-center gap-3 px-3 py-2.5 rounded-md text-wy-text-secondary hover:text-red-400 hover:bg-red-500/10 border border-transparent hover:border-red-500/25 transition-all duration-150"
>
<LogOut size={14} />
<span className="text-[11px] font-mono tracking-wider">DÉCONNEXION</span>
<LogOut size={16} />
<span className="text-sm font-medium">Déconnexion</span>
</button>
</div>