app/doc/colors.md

Définition des couleurs de l'UI

Configuration et utilisation

Les couleurs du ou des thèmes sont enregistrées dans plugins/vuetify.ts

Nom	Usage
primary	Couleur principale, utilisée pour le header, les boutons submit, les notifications, les liens de type actions dans les menus, les liens, etc.
primary-alt	Une variante atténuée de la couleur principale, utilisée par exemple pour mettre en surbrillance des éléments au survol
secondary	Couleur secondaire, utilisée pour le menu lateral, le bouton accès aide et pour le fond d'écran de la page de login
secondary-alt	Variante de la couleur secondary, utilisée entre autres pour le fond des liens du menu lateral au survol
neutral-strong	Couleur de fond de certains boutons comme les boutons Annuler, et fond de certains encarts
neutral	Couleur de fond du subheader, des en-têtes des accordéons, du calendrier, des datatables, des boutons d'action
neutral-soft	Couleur du fond des pages, fond des notifications non lues...
danger	Fond des bandeaux et panneaux d'alerte signifiant un risque, couleur du texte de certains contenus décrivant un statut
success	Fond des bandeaux et panneaux d'alerte signifiant un succès, couleur du texte de certains contenus décrivant un statut
warning	Fond des bandeaux et panneaux d'alerte servant d'avertissement
info	Fond des bandeaux et panneaux informatifs

Pour chacune de ces couleurs, on définit une ou plusieurs couleurs complémentaires, comme les couleurs n-[color] (voir plus bas)

Règles de nommage

On construit le nom d'une variable de couleur de la manière suivante :

([prefix]-)[name](-[suffix])

Si la partie 'name' comprend plusieurs mots, on les sépare, eux aussi, par des tirets -

Préfixe (optionnel)

Pour chaque couleur du thème, on définira des couleurs nommées n-[color] qui correspondent au "négatif" de la couleur, et qui permet de rendre du contenu visible sur un fond de la couleur color.

Suffixe (optionnel)

Un éventuel suffixe pourra aussi permettre de définir des variantes :

Suffixe	Signification
-alt	Couleur alternative, typiquement affichée au survol de la souris

Thèmes SCSS

Pour chaque couleur du thème, on a défini des classes css theme-[color] qui appliqueront les règles à la fois sur au fond de l'élément et à son contenu.

Ces classes sont définies dans le fichier assets/css/theme.scss