Layout admin : - src/app/admin/layout.tsx : route protégée requireRole(ADMIN), sidebar + topbar + breadcrumbs, data-admin sur racine pour theme sobre indépendant du theme public - Sidebar : 12 sections groupées (Vue d'ensemble, Catalogue, Activité, Membres, Contenu, Système), highlight de la route courante - TopBar : prompt ⌘K, lien vers site public, email admin - Breadcrumbs : auto depuis pathname - CommandPalette : ⌘K / Ctrl K, navigation ↑↓ + Entrée, recherche live debounced 150ms Dashboard : - 7 KPI cards avec tone neutral/ok/warn/info (réservations semaine, confirmées 30j, revenus reversés, occupation, nouveaux users, carbets publiés, avis à modérer) - Section raccourcis fréquents Theme admin : - globals.css : [data-admin] override le background+font, neutralise les borders sépia/papier teinté du theme aquarelle, garantit lisibilité permanente Recherche globale : - lib/admin/search.ts : query parallèle sur Carbet, User, Booking, ContentPage, PirogueProvider (5 résultats par catégorie, LIKE insensitive) - api/admin/search?q=… route handler avec requireRole KPI : - lib/admin/kpis.ts : 7 métriques live (cache 0), Promise.all, helper formatEur Pas de dépendance externe ajoutée (cmdk, shadcn) — composants custom Tailwind pour rester léger.
101 lines
3.9 KiB
CSS
101 lines
3.9 KiB
CSS
@import "tailwindcss";
|
|
|
|
:root {
|
|
--background: #ffffff;
|
|
--foreground: #171717;
|
|
}
|
|
|
|
@theme inline {
|
|
--color-background: var(--background);
|
|
--color-foreground: var(--foreground);
|
|
--font-sans: var(--font-geist-sans);
|
|
--font-mono: var(--font-geist-mono);
|
|
--font-serif: var(--font-serif);
|
|
|
|
/* === Theme Guyane (plugin theme-guyane) === */
|
|
/* Activé lorsque <body data-theme="guyane"> (gated par le plugin). */
|
|
--color-karbe-canopy-50: #f1f7f1;
|
|
--color-karbe-canopy-100: #dceadc;
|
|
--color-karbe-canopy-300: #82b58a;
|
|
--color-karbe-canopy-500: #2f7a3f; /* vert canopée Guyane */
|
|
--color-karbe-canopy-700: #1f5530;
|
|
--color-karbe-canopy-900: #103018;
|
|
|
|
--color-karbe-maroni-100: #e6e7d8; /* eau Maroni — vert-brun chargé latérite */
|
|
--color-karbe-maroni-300: #b4b690;
|
|
--color-karbe-maroni-500: #8a8a55;
|
|
--color-karbe-maroni-700: #5e5e32;
|
|
|
|
--color-karbe-laterite-300: #d99c6a; /* ocre latérite rougeâtre */
|
|
--color-karbe-laterite-500: #c46434;
|
|
--color-karbe-laterite-700: #8c3d18;
|
|
|
|
--color-karbe-wood-300: #c0a280;
|
|
--color-karbe-wood-500: #8d6b48; /* bois karbé */
|
|
--color-karbe-wood-700: #5a4329;
|
|
|
|
--color-karbe-bone: #f5f1e8; /* blanc cassé chaud */
|
|
--color-karbe-ink: #1a1a14;
|
|
}
|
|
|
|
body[data-theme="guyane"] {
|
|
--background: var(--color-karbe-bone);
|
|
--foreground: var(--color-karbe-ink);
|
|
font-family: var(--font-geist-sans), system-ui, sans-serif;
|
|
background-image:
|
|
radial-gradient(ellipse at top, rgba(47, 122, 63, 0.06) 0%, transparent 60%),
|
|
radial-gradient(ellipse at bottom, rgba(196, 100, 52, 0.04) 0%, transparent 60%);
|
|
}
|
|
|
|
/* === Theme Aquarelle (plugin theme-aquarelle) === */
|
|
/* Direction artistique « carnet naturaliste XIXᵉ ». Mutuellement exclusif
|
|
avec theme-guyane (le hook onEnable du plugin garantit qu'un seul est
|
|
actif à la fois). */
|
|
body[data-theme="aquarelle"] {
|
|
--background: #faf5e9; /* papier crème teinté */
|
|
--foreground: #2a2418; /* encre sépia foncée */
|
|
font-family: var(--font-serif), Georgia, serif;
|
|
/* Texture grain de papier subtile via SVG inline (~1.5 KB, pas de fetch). */
|
|
background-image:
|
|
radial-gradient(ellipse at 25% 15%, rgba(196, 100, 52, 0.05) 0%, transparent 50%),
|
|
radial-gradient(ellipse at 75% 85%, rgba(94, 94, 50, 0.05) 0%, transparent 50%),
|
|
url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' seed='17'/%3E%3CfeColorMatrix values='0 0 0 0 0.65 0 0 0 0 0.55 0 0 0 0 0.40 0 0 0 0.18 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
|
|
background-attachment: fixed;
|
|
}
|
|
|
|
/* Surcharges visuelles aquarelle : hairlines sépia partout en remplacement
|
|
des borders zinc/gray du theme-guyane. */
|
|
body[data-theme="aquarelle"] [class*="border-zinc-"],
|
|
body[data-theme="aquarelle"] [class*="border-gray-"] {
|
|
border-color: rgba(140, 61, 24, 0.25);
|
|
}
|
|
|
|
/* === Theme Admin (route /admin/...) === */
|
|
/* Indépendant des themes publics. Sobre, gris/blanc, accent ocre Karbé,
|
|
typographie sans-serif neutre. Pas de texture grain. Lisible en
|
|
permanence peu importe le toggle Aquarelle/Guyane côté site public. */
|
|
[data-admin] {
|
|
--background: #fafafa;
|
|
--foreground: #18181b;
|
|
font-family: var(--font-geist-sans), system-ui, sans-serif;
|
|
background-image: none !important;
|
|
}
|
|
[data-admin] [class*="border-zinc-"],
|
|
[data-admin] [class*="border-gray-"] {
|
|
/* Restaure des borders neutres dans l'admin si theme aquarelle est actif
|
|
côté body (qui les surcharge en sépia). */
|
|
border-color: #e4e4e7;
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
:root:not([data-theme="guyane"]):not([data-theme="aquarelle"]) {
|
|
--background: #0a0a0a;
|
|
--foreground: #ededed;
|
|
}
|
|
}
|
|
|
|
body {
|
|
background: var(--background);
|
|
color: var(--foreground);
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
}
|