MadJax/SchotzIAD
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Uniformiser le survol des boutons (orange) et le rendu des boutons Annuler

Browse Source 
- Survol orange plein (texte blanc) étendu aux boutons d'action
  secondaires : « Utiliser mon domicile », « Export PDF » (résumés
  mensuel/annuel), « Recopier le dernier barème », « Modifier » et
  « Enregistrer/Ajouter » (carnet d'adresses)
- Boutons « Annuler » uniformisés sur tout le site (fond blanc, bordure
  grise, survol gris clair), via classes dédiées .btn-annuler (barème)
  et .btn--annuler (carnet), alignés sur trajet-form et confirm-dialog
- Suppression (rouge), boutons à icône et indicateurs d'état inchangés
- Charte graphique de design.md mise à jour (convention d'interaction)
This commit is contained in:
MadJax
2026-10-03 10:20:25 +02:00
parent 5b72e21c9d
commit 6bdd67fd00
8 changed files with 65 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.kiro/specs/schotziad-km-tracker/design.md
+5 -1
View File
@@ -55,7 +55,11 @@
### Charte graphique
- **Palette officielle** (variables CSS globales dans `styles.scss`) : Orange `--couleur-orange: #F28C28`, Bleu IAD `--couleur-bleu: #0074B8` (couleur primaire), Gris anthracite `--couleur-anthracite: #343A40`, Gris clair `--couleur-gris-clair: #E7E9EA`, avec déclinaisons de survol `--couleur-bleu-fonce` et `--couleur-orange-fonce`.
- **Convention d'interaction** : les boutons d'action à fond bleu (texte, ex. `.btn-principal`, `.btn-primaire`, `.btn-confirmer`) passent à l'orange au survol. Cette règle ne s'applique PAS aux boutons à fond différent (rouge pour la suppression, blanc pour les actions secondaires) ni aux boutons à icône. Les indicateurs d'état sélectionné/actif (lien de navigation actif, mois sélectionné, onglet actif) restent en bleu plein, sans changement de teinte au survol.
- **Convention d'interaction** : tous les boutons d'ACTION passent à l'orange plein au survol (texte blanc), qu'ils soient à fond bleu plein (ex. `.btn-principal`, `.btn-primaire`, bouton de soumission bleu) ou à fond blanc/clair avec texte bleu (actions secondaires, ex. « Utiliser mon domicile » `.btn-domicile`, « Export PDF » `.btn-secondaire` des résumés, « Recopier le dernier barème » `.btn-secondaire` du barème, « Modifier » et « Enregistrer/Ajouter » du carnet d'adresses). L'intention : harmoniser le feedback de survol de toutes les actions sur l'orange de la charte. Exceptions qui NE passent PAS à l'orange au survol :
- Les boutons « Annuler » : rendu neutre uniformisé sur tout le site (fond blanc, bordure grise `#c4c9d1`, texte `#33475b`, survol gris clair `#f3f5f8`), aligné sur l'écran d'ajout/modification d'un trajet et repris à l'identique sur le barème (`.btn-annuler`), le carnet d'adresses (`.btn--annuler`) et le composant partagé `confirm-dialog`.
- Les boutons de suppression (rouge) : restent rouges.
- Les boutons à icône seule.
- Les indicateurs d'état sélectionné/actif (lien de navigation actif, mois sélectionné, onglet actif) : restent en bleu plein, sans changement de teinte au survol.
- **Assets graphiques** (`frontend/src/assets/images/`) :
- `logo-icon.png` : icône seule, affichée en tête de la barre de navigation (fond blanc localisé pour ressortir sur la barre anthracite).
- `logo-carre.png` : logo avec texte vertical, centré au-dessus du formulaire sur les 4 pages d'authentification (connexion, inscription, mot de passe oublié, réinitialisation).