Gestion des Thèmes

2026-09-06 18:59:09 +02:00
1 parent bab7a79b63
commit be3c93897b
@@ -0,0 +1,53 @@
+/**
+ * colorThemes.js — liste partagée des 10 thèmes de couleur d'interface
+ * (Admin > Général, cf. project_theme_interface.md), et de leur association
+ * avec la palette de graphiques correspondante (Settings > Apparence, cf.
+ * chartPalettes.js).
+ *
+ * Utilisé par GeneralSection.jsx (thème par défaut de l'application,
+ * Admin > Général) ET AppearanceSection.jsx (thème personnel de
+ * l'utilisateur, Settings > Apparence, 06/09/26) — auparavant dupliqué
+ * uniquement côté admin ; extrait ici pour que les deux sélecteurs restent
+ * strictement synchronisés (mêmes valeurs, mêmes libellés, même swatch).
+ */
+
+// 05/09/26 (suite, même jour) : les couleurs "Intérêts" des palettes
+// indigo_teal/nuit/frais/pastel ont été retravaillées (trop proches du bleu
+// classique et peu distinguables entre elles) pour une meilleure diversité
+// sur tout le cercle chromatique — cf. utils/chartPalettes.js et
+// project_theme_interface.md. Le swatch de chaque thème reprend exactement
+// la couleur --primary (mode clair) de ce thème dans styles.css.
+export const COLOR_THEMES = [
+  { value: 'classique',          label: 'Classique (défaut)', swatch: '#1e40af' },
+  { value: 'indigo_teal',        label: 'Indigo & Teal',       swatch: '#20976a' },
+  { value: 'frais',              label: 'Frais',               swatch: '#009cc1' },
+  { value: 'nuit',               label: 'Nuit',                swatch: '#4839ac' },
+  { value: 'nature',             label: 'Nature',              swatch: '#43a047' },
+  { value: 'coucher_de_soleil',  label: 'Coucher de soleil',   swatch: '#ffa722' },
+  { value: 'violet',             label: 'Violet',              swatch: '#8d57c2' },
+  { value: 'contraste',          label: 'Contraste',           swatch: '#e53935' },
+  { value: 'moderne',            label: 'Moderne',             swatch: '#b027b0' },
+  { value: 'pastel',             label: 'Pastel',              swatch: '#f53d97' },
+];
+
+// Nom de la palette (Settings > Apparence, cf. utils/chartPalettes.js)
+// correspondant à chaque thème : sert à adapter automatiquement les
+// couleurs de graphiques d'un compte quand ce thème est choisi (admin par
+// défaut, ou personnel — cf. reverse-coupling dans GeneralSection.jsx et
+// AppearanceSection.jsx).
+export const THEME_TO_PALETTE_NAME = {
+  classique:          'Classique',
+  indigo_teal:        'Indigo & Teal',
+  nuit:               'Nuit',
+  nature:             'Nature',
+  coucher_de_soleil:  'Coucher de soleil',
+  violet:             'Violet',
+  frais:              'Frais',
+  contraste:          'Contraste',
+  pastel:             'Pastel',
+  moderne:            'Moderne',
+};
+
+export function colorThemeSwatch(themeValue) {
+  return COLOR_THEMES.find(t => t.value === themeValue)?.swatch || COLOR_THEMES[0].swatch;
+}