karbe/src/app/globals.css
Claude Integration bcb93c6b29 feat(admin): shell admin + dashboard KPI + recherche ⌘K (Sprint 1)
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.
2026-05-31 18:21:50 +00:00

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;
}