diff --git a/components/ui/Header.tsx b/components/ui/Header.tsx index 3c477d3..a14c7dd 100644 --- a/components/ui/Header.tsx +++ b/components/ui/Header.tsx @@ -1,6 +1,7 @@ import { Card, CardContent } from '@/components/ui/Card'; import { TaskStats } from '@/lib/types'; import { useTheme } from '@/contexts/ThemeContext'; +import { usePathname } from 'next/navigation'; import Link from 'next/link'; interface HeaderProps { @@ -12,6 +13,26 @@ interface HeaderProps { export function Header({ title = "TowerControl", subtitle = "Task Management", stats, syncing = false }: HeaderProps) { const { theme, toggleTheme } = useTheme(); + const pathname = usePathname(); + + // Fonction pour déterminer si un lien est actif + const isActiveLink = (href: string) => { + if (href === '/') { + return pathname === '/'; + } + return pathname.startsWith(href); + }; + + // Fonction pour obtenir les classes CSS d'un lien + const getLinkClasses = (href: string) => { + const baseClasses = "font-mono text-sm uppercase tracking-wider transition-colors px-3 py-1.5 rounded-md"; + + if (isActiveLink(href)) { + return `${baseClasses} text-[var(--primary)] bg-[var(--primary)]/10 border border-[var(--primary)]/30`; + } + + return `${baseClasses} text-[var(--muted-foreground)] hover:text-[var(--primary)] hover:bg-[var(--card-hover)]`; + }; return (
@@ -19,7 +40,7 @@ export function Header({ title = "TowerControl", subtitle = "Task Management", s
{/* Titre tech avec glow */}
-
+
{/* Navigation */} -