# Contributing — Le Librodrome ## Architecture ``` app/ pages/ numerique/ # Section autonomie numérique index.vue # Vue d'ensemble (3 piliers) [slug].vue # Détail pilier (contenu YAML) economique/ # Section autonomie économique index.vue # Vue d'ensemble (monnaie libre, livre, productions) monnaie-libre.vue commande.vue # Commande du livre (Bookelis + librairie) productions-collectives.vue modele-eco/ index.vue # Couverture livre + sommaire chapitres [slug].vue # Lecteur de chapitre (Nuxt Content) citoyenne/ # Section autonomie citoyenne index.vue # Vue d'ensemble (decision, tarifs-eau) [slug].vue # Détail (contenu YAML) en-musique/ # Player audio evenement.vue admin/ # Back-office protégé pages/ index.vue # Liste toutes les pages YAML [...path].vue # Éditeur YAML (supporte les sous-dossiers) components/ book/Actions.vue # Boutons partagés du livre (player, PDF, chapitres, commande) home/BookSection.vue # Bloc couverture + CTAs (utilise BookActions) home/AxisBlock.vue # Bloc axe sur la home (supporte actions lien via `to`) home/AxisGrid.vue # Grille 3 axes + GrateWizard stores/palette.ts # 4 palettes saisonnières (été par défaut) ``` ## Contenu YAML API : `GET /api/content/pages/{path}` — supporte les chemins imbriqués (`numerique/logiciel-libre`). Admin : `PUT /api/admin/content/pages/{path}` + `GET /api/admin/content/pages` (liste). Les fichiers YAML sont dans `site/pages/`, organisés en sous-dossiers par section. ## Palettes 4 palettes dans `stores/palette.ts` : automne, hiver, printemps, été. - Défaut : **été** (premier visiteur) - Persisté en `localStorage('palette')` pour les visites suivantes - CSS : variables `--color-primary`, `--color-accent`, etc. + classe `.palette-light`/`.palette-dark` - Overrides light mode dans `main.css` (`.palette-light .text-white` → couleur adaptive) - Admin : tous les `color: white` dans les composants admin sont remplacés par `hsl(var(--color-text))` sauf les boutons sur fond `hsl(var(--color-primary))` (`AdminSaveButton`, `.login-btn`) ## Navigation contextuelle — pages détail `[slug].vue` (numérique, citoyenne) embarque : - **Prev/next** (`ctx-nav`) en haut de page — liens vers les pages adjacentes dans la section - **Sommaire flottant** (`.sommaire-sidebar`, `position: sticky`) dans un aside absolu à droite — visible ≥ 1300px, `overflow: clip` sur le parent pour ne pas casser le sticky Les ancres sont des `
` avec `scroll-margin-top: 5.5rem` (offset header fixe). ## Types de sections YAML `[slug].vue` supporte : `arguments`, `fiche`, `equivalents`, `llm`, `atelier`, `links`, `insight`, `tiers`, `projet`, `territoire`. `type: territoire` : économies alternatives (euro/Ğ1), grille bouquet de services, tableau matériel dépliable (`
`). `type: projet` : carte gestation avec grille de features. ## Shadoks Illustrations SVG inline sur chaque page, thématiques par section : - Numérique index : métiers tech/industrie (codeuse, électricien, soudeuse, cryptographe...) - Numérique détail : postures geek (pinguin+USB, web-of-trust, rubber duck, caféine, rack serveur, debugger loupe) - Économique : artisanat/agriculture (boulangère, potier, forgeron...) - Citoyenne : navigation/justice/théâtre (capitaine, avocate, comédien...) - Modèle éco : livre/édition (typographe, calligraphe, conteuse...) - Événement : spectacle (funambule, accordéoniste, jongleur...) Règles : corps compact, longues pattes, grands pieds plats, bec pointu, postures variées. CSS : `position: absolute`, `pointer-events: none`, `opacity 0.18-0.28`, animation float, `display: none` sur mobile. Parent avec `overflow: clip` (pas `overflow: hidden` qui casserait `position: sticky`). ## Analytics `app/composables/useTracking.ts` — wrapper Umami. Activé si `NUXT_PUBLIC_UMAMI_WEBSITE_ID` est défini. `server/api/stats/index.get.ts` — endpoint public pour la fédération inter-instances (observatoires territoire). `docker/docker-compose.umami.yml` — stack Umami + PostgreSQL avec labels Traefik. ## Redirections `server/middleware/redirects.ts` : - `/gestation/*` → section appropriée - `/modele-eco/*` → `/economique/modele-eco/*` - `/decision` → `/citoyenne/decision` - `/lire/*` → `/economique/modele-eco/*` - `/ecouter/*` → `/en-musique/*` ## Conventions - Commits en français, concis - Build prod vérifié avant push (`PORT=3099 node .output/server/index.mjs`) - Port dev : 3000 (fixe, jamais de fallback)