bugfix: the whole theming structure overhauled. light/dark mode icon added.

This commit is contained in:
2026-04-29 01:22:53 +03:30
parent bdd889ac09
commit a264523e12
20 changed files with 422 additions and 217 deletions

View File

@@ -26,9 +26,9 @@ export default function Sidebar() {
const router = useRouter();
return (
<aside className="w-64 bg-[#071a2f] text-white flex flex-col p-4">
<div className="mb-8">
<h1 className="text-xl font-bold">DyoLink</h1>
<aside className="w-64 bg-background-secondary/90 border-r border-border text-text-primary flex flex-col p-4">
<div className="mb-6 pb-4 border-b border-border">
<h1 className="text-xl font-semibold tracking-tight">DyoLink</h1>
</div>
<nav className="flex flex-col gap-2">
@@ -40,14 +40,14 @@ export default function Sidebar() {
<button
key={item.name}
onClick={() => router.push(item.path)}
className={`flex items-center gap-3 p-3 rounded-lg transition ${
className={`flex items-center gap-3 px-3 py-2.5 rounded-[var(--radius-sm)] border transition-colors ${
isActive
? 'bg-primary-600'
: 'hover:bg-white/10'
? 'bg-primary-soft border-primary/60 text-text-primary'
: 'border-border/50 text-text-secondary hover:bg-background-card/70 hover:text-text-primary hover:border-border'
}`}
>
<Icon className="w-5 h-5" />
<span>{item.name}</span>
<Icon className="w-[18px] h-[18px] icon-flat" />
<span className="text-sm">{item.name}</span>
</button>
);
})}