f825a2392c
Changes:
- Add next-themes dependency for theme management
- Create ThemeProvider wrapper for app root layout
- Set dark mode as default theme
- Create ThemeToggle component with Sun/Moon icons
- Add theme toggle to home page navigation
- Add theme toggle to dashboard header
- App now starts in dark mode with ability to switch to light mode
Styling uses existing Tailwind dark mode variables configured in
tailwind.config.ts and globals.css. All existing components automatically
support dark theme.
🤖 Generated with Claude Code
Co-Authored-By: Claude <noreply@anthropic.com>
59 lines
2.0 KiB
TypeScript
59 lines
2.0 KiB
TypeScript
import Link from "next/link"
|
||
import { Button } from "@/components/ui/button"
|
||
import { ThemeToggle } from "@/components/theme-toggle"
|
||
|
||
export default function Home() {
|
||
return (
|
||
<div className="min-h-screen bg-background flex flex-col">
|
||
{/* Navigation */}
|
||
<nav className="border-b border-border bg-card/30 backdrop-blur-sm">
|
||
<div className="max-w-6xl mx-auto px-4 py-4 flex items-center justify-between">
|
||
<div className="flex items-center gap-2 text-xl font-bold text-accent">
|
||
<span>🗳️</span>
|
||
<span>E-Voting</span>
|
||
</div>
|
||
<div className="flex items-center gap-4">
|
||
<ThemeToggle />
|
||
<Link href="/auth/login">
|
||
<Button variant="ghost">Se Connecter</Button>
|
||
</Link>
|
||
<Link href="/auth/register">
|
||
<Button>S'inscrire</Button>
|
||
</Link>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
|
||
{/* Main Content */}
|
||
<main className="flex-1 flex items-center justify-center px-4">
|
||
<div className="text-center space-y-8 max-w-2xl">
|
||
<div className="space-y-4">
|
||
<h1 className="text-4xl md:text-5xl font-bold">
|
||
E-Voting
|
||
</h1>
|
||
<p className="text-lg text-muted-foreground">
|
||
Plateforme de vote électronique sécurisée
|
||
</p>
|
||
</div>
|
||
|
||
<div className="flex flex-col sm:flex-row gap-4 justify-center pt-4">
|
||
<Link href="/auth/login">
|
||
<Button size="lg">Se Connecter</Button>
|
||
</Link>
|
||
<Link href="/auth/register">
|
||
<Button variant="outline" size="lg">Créer un Compte</Button>
|
||
</Link>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
|
||
{/* Footer */}
|
||
<footer className="border-t border-border bg-card/30 py-6">
|
||
<div className="max-w-6xl mx-auto px-4 text-center text-sm text-muted-foreground">
|
||
<p>© 2025 E-Voting</p>
|
||
</div>
|
||
</footer>
|
||
</div>
|
||
)
|
||
}
|