- [slug].vue : sommaire sticky (overflow:clip sur parent), prev/next en haut, 6 shadoks geek (pinguin+USB, web-of-trust, rubber-duck, caféine, debugger loupe, rack serveur) - Nouveaux types de sections : territoire (bouquet sweethomeCloud, 2 modèles éco, tableau matériel dépliable), projet (carte gestation) - cloud-libre.yml : section sweethomeCloud complète avec infra 50 000 hab. (~2€/an/hab) - authentification-wot.yml : trustWallet, correction WoT Duniter (Ed25519+Scrypt, sigQty=5, stepMax=3), DID/VC standards - logiciel-libre.yml : carte projet wishBounty - home.yml + numerique.yml : cloud-libre → sweethomeCloud, description RGPD/local-first - AxisBlock.vue : bulles de présentation inline dans les cards (plus de tooltip absolu) - Analytics : useTracking.ts (Umami), docker-compose.umami.yml, /api/stats fédération - nuxt.config.ts : config Umami runtime Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
4.7 KiB
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: whitedans les composants admin sont remplacés parhsl(var(--color-text))sauf les boutons sur fondhsl(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: clipsur le parent pour ne pas casser le sticky
Les ancres sont des <div :id="\s${si}`" class="section-anchor">avecscroll-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 (<details>).
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)