feat: grille dashboard fluide, conteneur élargi et theme toggle plus visible
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 4m0s

- max-w-5xl → max-w-7xl sur le layout global
- grille auto-fill minmax(300px,1fr) pour grands écrans
- ThemeToggle : bordure + fond permanents, emoji text-lg

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-02-23 13:55:26 +01:00
parent 92c819d339
commit 895df3f7d9
3 changed files with 4 additions and 4 deletions

View File

@@ -31,7 +31,7 @@ export default function RootLayout({
<SessionProvider>
<ThemeProvider>
<Header />
<main className="mx-auto max-w-5xl px-4 py-6">{children}</main>
<main className="mx-auto max-w-7xl px-4 py-6">{children}</main>
</ThemeProvider>
</SessionProvider>
</body>

View File

@@ -305,7 +305,7 @@ export function DashboardClient({ evaluations }: DashboardClientProps) {
<h2 className="mb-3 font-mono text-sm font-medium text-zinc-600 dark:text-zinc-400">
{team ?? "Sans équipe"}
</h2>
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
<div className="grid gap-4 [grid-template-columns:repeat(auto-fill,minmax(300px,1fr))]">
{evals.map((e) => (
<EvalCard
key={e.id}
@@ -322,7 +322,7 @@ export function DashboardClient({ evaluations }: DashboardClientProps) {
))}
</div>
) : (
<div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
<div className="grid gap-4 [grid-template-columns:repeat(auto-fill,minmax(300px,1fr))]">
{list.map((e) => (
<EvalCard
key={e.id}

View File

@@ -9,7 +9,7 @@ export function ThemeToggle() {
<button
type="button"
onClick={() => setTheme(theme === "dark" ? "light" : "dark")}
className="font-mono text-xs text-zinc-600 dark:text-zinc-500 hover:text-zinc-800 dark:hover:text-zinc-300 transition-colors"
className="flex items-center justify-center w-8 h-8 rounded border border-zinc-200 dark:border-zinc-600 bg-zinc-50 dark:bg-zinc-800 text-lg text-zinc-600 dark:text-zinc-300 hover:border-zinc-300 dark:hover:border-zinc-500 hover:bg-zinc-100 dark:hover:bg-zinc-700 transition-colors"
title={theme === "dark" ? "Passer au thème clair" : "Passer au thème sombre"}
>
{theme === "dark" ? "☀" : "☽"}