71 lines
2.9 KiB
TypeScript
71 lines
2.9 KiB
TypeScript
// =====================================================================
|
|
// Système de « tons » — source unique de vérité pour la couleur
|
|
// sémantique (badges, pastilles, barres, textes d'accentuation).
|
|
//
|
|
// Chaque ton s'adapte AU THÈME : classes claires par défaut, variantes
|
|
// `dark:` pour le mode sombre. Aucune page ne doit écrire de
|
|
// `bg-amber-100` ou `text-gray-500` en dur : tout passe par ici.
|
|
// =====================================================================
|
|
|
|
export type Tone =
|
|
| 'slate'
|
|
| 'sky'
|
|
| 'amber'
|
|
| 'rose'
|
|
| 'emerald'
|
|
| 'violet'
|
|
| 'fuchsia'
|
|
| 'cyan'
|
|
| 'orange'
|
|
| 'lime'
|
|
| 'indigo'
|
|
| 'teal'
|
|
|
|
/** Badge « doux » : fond teinté + texte lisible, en clair comme en sombre. */
|
|
export const TONE_BADGE: Record<Tone, string> = {
|
|
slate: 'bg-slate-500/10 text-slate-600 dark:bg-slate-400/15 dark:text-slate-300',
|
|
sky: 'bg-sky-500/10 text-sky-700 dark:bg-sky-400/15 dark:text-sky-300',
|
|
amber: 'bg-amber-500/12 text-amber-700 dark:bg-amber-400/15 dark:text-amber-300',
|
|
rose: 'bg-rose-500/10 text-rose-700 dark:bg-rose-400/15 dark:text-rose-300',
|
|
emerald: 'bg-emerald-500/10 text-emerald-700 dark:bg-emerald-400/15 dark:text-emerald-300',
|
|
violet: 'bg-violet-500/10 text-violet-700 dark:bg-violet-400/15 dark:text-violet-300',
|
|
fuchsia: 'bg-fuchsia-500/10 text-fuchsia-700 dark:bg-fuchsia-400/15 dark:text-fuchsia-300',
|
|
cyan: 'bg-cyan-500/10 text-cyan-700 dark:bg-cyan-400/15 dark:text-cyan-300',
|
|
orange: 'bg-orange-500/12 text-orange-700 dark:bg-orange-400/15 dark:text-orange-300',
|
|
lime: 'bg-lime-500/12 text-lime-700 dark:bg-lime-400/15 dark:text-lime-300',
|
|
indigo: 'bg-indigo-500/10 text-indigo-700 dark:bg-indigo-400/15 dark:text-indigo-300',
|
|
teal: 'bg-teal-500/10 text-teal-700 dark:bg-teal-400/15 dark:text-teal-300'
|
|
}
|
|
|
|
/** Aplat plein : pastille de statut, barre de progression, liseré. */
|
|
export const TONE_DOT: Record<Tone, string> = {
|
|
slate: 'bg-slate-400',
|
|
sky: 'bg-sky-500',
|
|
amber: 'bg-amber-500',
|
|
rose: 'bg-rose-500',
|
|
emerald: 'bg-emerald-500',
|
|
violet: 'bg-violet-500',
|
|
fuchsia: 'bg-fuchsia-500',
|
|
cyan: 'bg-cyan-500',
|
|
orange: 'bg-orange-500',
|
|
lime: 'bg-lime-500',
|
|
indigo: 'bg-indigo-500',
|
|
teal: 'bg-teal-500'
|
|
}
|
|
|
|
/** Texte seul coloré (chiffres clés, libellés d'accentuation). */
|
|
export const TONE_TEXT: Record<Tone, string> = {
|
|
slate: 'text-slate-600 dark:text-slate-300',
|
|
sky: 'text-sky-600 dark:text-sky-300',
|
|
amber: 'text-amber-600 dark:text-amber-300',
|
|
rose: 'text-rose-600 dark:text-rose-300',
|
|
emerald: 'text-emerald-600 dark:text-emerald-300',
|
|
violet: 'text-violet-600 dark:text-violet-300',
|
|
fuchsia: 'text-fuchsia-600 dark:text-fuchsia-300',
|
|
cyan: 'text-cyan-600 dark:text-cyan-300',
|
|
orange: 'text-orange-600 dark:text-orange-300',
|
|
lime: 'text-lime-600 dark:text-lime-300',
|
|
indigo: 'text-indigo-600 dark:text-indigo-300',
|
|
teal: 'text-teal-600 dark:text-teal-300'
|
|
}
|