Refonte design : 4 humeurs, onboarding, sections avec boite a outils

- Systeme de themes adaptatifs : Peps (light chaud), Zen (light calme),
  Chagrine (dark violet), Grave (dark ambre) avec CSS custom properties
- Dashboard d'accueil orienté onboarding avec cartes-portes et teaser
  boite a outils
- SectionLayout reutilisable : liste + sidebar toolbox + status pills
  cliquables (En prepa / En vote / En vigueur / Clos)
- ToolboxVignette : vignettes Contexte / Tutos / Choisir / Demarrer
- Seed : Acte engagement certification + forgeron, Runtime Upgrade
  (decision on-chain), 3 modalites de vote (majoritaire, quadratique,
  permanent)
- Backend adapte SQLite (Uuid portable, 204 fix, pool conditionnel)
- Correction noms composants (pathPrefix: false), pinia/nuxt ^0.11

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Yvv
2026-02-28 17:44:48 +01:00
parent 403b94fa2c
commit 77dceb49c3
49 changed files with 20628 additions and 1180 deletions

View File

@@ -0,0 +1,167 @@
/* ==========================================================================
Glibredecision — Mood / Ambiance System
4 moods: Peps (light), Zen (light), Chagrine (dark), Grave (dark)
========================================================================== */
/* --------------------------------------------------------------------------
Peps — Energique et chaleureux (Light)
-------------------------------------------------------------------------- */
.mood-peps {
--mood-bg: #ffffff;
--mood-surface: #fffbf5;
--mood-surface-hover: #fff5ea;
--mood-text: #1a1a1a;
--mood-text-muted: #6b6b6b;
--mood-accent: #e85d26;
--mood-accent-soft: #fff3ed;
--mood-accent-text: #ffffff;
--mood-border: #fde8d8;
--mood-success: #22c55e;
--mood-warning: #f59e0b;
--mood-error: #ef4444;
--mood-gradient: linear-gradient(135deg, #fff8f0 0%, #ffffff 100%);
--mood-shadow: rgba(232, 93, 38, 0.08);
--mood-status-prepa: #fed7aa;
--mood-status-prepa-text: #9a3412;
--mood-status-vote: #bfdbfe;
--mood-status-vote-text: #1e40af;
--mood-status-vigueur: #bbf7d0;
--mood-status-vigueur-text: #166534;
--mood-status-clos: #e5e7eb;
--mood-status-clos-text: #374151;
}
/* --------------------------------------------------------------------------
Zen — Calme et serein (Light)
-------------------------------------------------------------------------- */
.mood-zen {
--mood-bg: #f8faf8;
--mood-surface: #ffffff;
--mood-surface-hover: #f0f7f2;
--mood-text: #1a2e1a;
--mood-text-muted: #5f7a5f;
--mood-accent: #4a9e6f;
--mood-accent-soft: #ecf5ef;
--mood-accent-text: #ffffff;
--mood-border: #d4e7d9;
--mood-success: #34d399;
--mood-warning: #fbbf24;
--mood-error: #f87171;
--mood-gradient: linear-gradient(135deg, #f0f7f2 0%, #f8faf8 100%);
--mood-shadow: rgba(74, 158, 111, 0.08);
--mood-status-prepa: #fde68a;
--mood-status-prepa-text: #78350f;
--mood-status-vote: #a7f3d0;
--mood-status-vote-text: #065f46;
--mood-status-vigueur: #bbf7d0;
--mood-status-vigueur-text: #166534;
--mood-status-clos: #d1d5db;
--mood-status-clos-text: #374151;
}
/* --------------------------------------------------------------------------
Chagrine — Profond et subtil (Dark)
-------------------------------------------------------------------------- */
.mood-chagrine {
--mood-bg: #1a1625;
--mood-surface: #231e30;
--mood-surface-hover: #2d2640;
--mood-text: #e8e0f0;
--mood-text-muted: #9b8fb5;
--mood-accent: #9b7fd4;
--mood-accent-soft: #2d2640;
--mood-accent-text: #ffffff;
--mood-border: #342d45;
--mood-success: #6ee7b7;
--mood-warning: #fcd34d;
--mood-error: #fca5a5;
--mood-gradient: linear-gradient(135deg, #1a1625 0%, #231e30 100%);
--mood-shadow: rgba(155, 127, 212, 0.12);
--mood-status-prepa: #4c1d95;
--mood-status-prepa-text: #ddd6fe;
--mood-status-vote: #312e81;
--mood-status-vote-text: #c7d2fe;
--mood-status-vigueur: #064e3b;
--mood-status-vigueur-text: #a7f3d0;
--mood-status-clos: #2d2640;
--mood-status-clos-text: #9b8fb5;
}
/* --------------------------------------------------------------------------
Grave — Serieux et solennel (Dark)
-------------------------------------------------------------------------- */
.mood-grave {
--mood-bg: #141518;
--mood-surface: #1c1d21;
--mood-surface-hover: #262420;
--mood-text: #e5e5e0;
--mood-text-muted: #8a8a85;
--mood-accent: #d4a545;
--mood-accent-soft: #262420;
--mood-accent-text: #141518;
--mood-border: #2a2b30;
--mood-success: #86efac;
--mood-warning: #fde68a;
--mood-error: #fca5a5;
--mood-gradient: linear-gradient(135deg, #141518 0%, #1c1d21 100%);
--mood-shadow: rgba(212, 165, 69, 0.10);
--mood-status-prepa: #78350f;
--mood-status-prepa-text: #fde68a;
--mood-status-vote: #1e3a5f;
--mood-status-vote-text: #93c5fd;
--mood-status-vigueur: #14532d;
--mood-status-vigueur-text: #86efac;
--mood-status-clos: #27272a;
--mood-status-clos-text: #a1a1aa;
}
/* ==========================================================================
Base Utilities
========================================================================== */
/* Transition all mood changes smoothly */
body {
transition: background-color 0.3s ease, color 0.3s ease;
}
/* Status labels — clickable pill style */
.status-pill {
display: inline-flex;
align-items: center;
padding: 0.25rem 0.75rem;
border-radius: 9999px;
font-size: 0.75rem;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
user-select: none;
}
.status-pill:hover {
filter: brightness(0.92);
transform: scale(1.05);
}
.status-pill.active {
ring: 2px;
ring-offset: 2px;
}
.status-prepa {
background: var(--mood-status-prepa);
color: var(--mood-status-prepa-text);
}
.status-vote {
background: var(--mood-status-vote);
color: var(--mood-status-vote-text);
}
.status-vigueur {
background: var(--mood-status-vigueur);
color: var(--mood-status-vigueur-text);
}
.status-clos {
background: var(--mood-status-clos);
color: var(--mood-status-clos-text);
}