Ismail/CPLv4.0
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP: dark mode Modale

Browse Source
This commit is contained in:
ISA
2025-09-08 15:33:26 +02:00
parent fefff9419d
commit af21b180f1
23 changed files with 209 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
components/navigation/Navigation.tsx
View File

@@ -36,7 +36,7 @@ const Navigation: React.FC<NavigationProps> = ({ className }) => {
];
return (
<aside className="h-full bg-[var(--color-surface)] dark:bg-[var(--color-surface)] border-r border-[var(--color-border)]">
<aside className="h-full bg-[var(--color-surface)] dark:bg-[var(--color-surface)] border-r border-[var(--color-border)]">
<nav className={`h-full flex-shrink-0 mt-16 ${className || "w-48"}`}>
{menuItems.map((item) => (
<div key={item.name}>
@@ -50,9 +50,11 @@ const Navigation: React.FC<NavigationProps> = ({ className }) => {
prefetch={false}
onClick={() => setActiveLink(item.path)}
className={`block px-4 py-2 mb-4 font-semibold whitespace-nowrap transition duration-200 rounded-r-full pr-6 relative text-[1rem] sm:text-[1rem] md:text-[1rem] lg:text-[1rem] xl:text-sm 2xl:text-lg
${activeLink.startsWith(item.path)
? 'bg-[var(--color-accent)] text-white shadow-sm xl:mr-4 xl:w-full'
: 'text-[var(--color-fg-muted)] hover:text-[var(--color-fg)] hover:bg-[var(--color-surface-alt)]/80 dark:hover:bg-[var(--color-surface-alt)]/40'}
${
activeLink.startsWith(item.path)
? "bg-[var(--color-accent)] text-white shadow-sm xl:mr-4 xl:w-full"
: "text-[var(--color-fg-muted)] hover:text-[var(--color-fg)] hover:bg-[var(--color-surface-alt)]/80 dark:hover:bg-[var(--color-surface-alt)]/40"
}
`}
>
{item.name}