From 91b59d4ce7c19c90418267a6ae0e20c962357b1c Mon Sep 17 00:00:00 2001 From: Nikolaz Date: Mon, 21 Sep 2026 09:17:14 +0200 Subject: [PATCH] Charte graphique SchotzIAD : logo, favicon, palette de couleurs MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Intègre l'identité visuelle officielle (planche fournie) : - Assets ajoutés (frontend/src/assets/images/) : logo-icon, logo-carre, logo-horizontal (réservé aux PDF, non encore câblé), favicon. - Favicon : src/favicon.ico régénéré depuis favicon.png (16/32/48, via Pillow) pour remplacer l'icône Angular par défaut ; PNG référencé en priorité dans index.html avec cache-busting (?v=) pour contourner le cache favicon des navigateurs Chromium (Chrome/Brave). - Barre de navigation : logo-icon en tête (fond blanc localisé pour ressortir sur l'anthracite), couleurs de charte (fond anthracite, lien actif bleu IAD, survol orange). - Pages d'authentification (login, register, forgot-password, reset-password) : logo carré centré au-dessus du formulaire, boutons en bleu IAD. - Palette officielle en variables CSS globales (styles.scss) : --couleur-orange, --couleur-bleu, --couleur-anthracite, --couleur-gris-clair (+ déclinaisons de survol). - Harmonisation des boutons d'action à fond bleu (texte) sur toute l'app : survol orange (véhicules, profil, barème, montants réglés, résumés mensuel/ annuel, onboarding, formulaire de trajet, dialog de confirmation, carte). Exclusions volontaires : boutons rouges (suppression), boutons à icône, boutons secondaires à fond blanc, indicateurs d'état sélectionné/actif. Specs : design.md complété (section Charte graphique : palette, convention de survol, rôle de chaque asset). --- .kiro/specs/schotziad-km-tracker/design.md | 10 +++++++ frontend/src/app/app.component.html | 4 +++ frontend/src/app/app.component.scss | 28 +++++++++++++++--- .../forgot-password.component.html | 1 + .../forgot-password.component.scss | 18 +++++++++-- .../features/auth/login/login.component.html | 1 + .../features/auth/login/login.component.scss | 18 +++++++++-- .../auth/register/register.component.html | 1 + .../auth/register/register.component.scss | 18 +++++++++-- .../reset-password.component.html | 1 + .../reset-password.component.scss | 18 +++++++++-- .../app/features/bareme/bareme.component.scss | 9 ++++-- .../carte-trajets.component.scss | 4 +-- .../consultation-jour.component.scss | 4 +-- .../montants-regles.component.scss | 9 ++++-- .../onboarding/onboarding.component.scss | 9 ++++-- .../app/features/profil/profil.component.scss | 9 ++++-- .../resume-annuel.component.scss | 9 ++++-- .../resume-mensuel.component.scss | 9 ++++-- .../trajet-form/trajet-form.component.scss | 4 +-- .../vehicules/vehicules.component.scss | 9 ++++-- .../confirm-dialog.component.scss | 5 ++-- frontend/src/assets/images/favicon.png | Bin 0 -> 26719 bytes frontend/src/assets/images/logo-carre.png | Bin 0 -> 136254 bytes .../src/assets/images/logo-horizontal.png | Bin 0 -> 153377 bytes frontend/src/assets/images/logo-icon.png | Bin 0 -> 18899 bytes frontend/src/favicon.ico | Bin 15086 -> 9672 bytes frontend/src/index.html | 13 ++++++-- frontend/src/styles.scss | 15 ++++++++++ 29 files changed, 185 insertions(+), 41 deletions(-) create mode 100644 frontend/src/assets/images/favicon.png create mode 100644 frontend/src/assets/images/logo-carre.png create mode 100644 frontend/src/assets/images/logo-horizontal.png create mode 100644 frontend/src/assets/images/logo-icon.png diff --git a/.kiro/specs/schotziad-km-tracker/design.md b/.kiro/specs/schotziad-km-tracker/design.md index 6cf755a..a4919c4 100644 --- a/.kiro/specs/schotziad-km-tracker/design.md +++ b/.kiro/specs/schotziad-km-tracker/design.md @@ -46,6 +46,16 @@ - **Génération PDF** : côté backend, bibliothèque QuestPDF - **Hébergement** : l'application est packagée et hébergée via **Docker Compose** — un conteneur `frontend` (Angular servi par nginx en interne) publié sur le port hôte **2202**, et un conteneur `backend` (ASP.NET Core API) non exposé à l'hôte. Le fichier SQLite est persisté via un **bind mount** (`./data:/data`) dans le conteneur backend, ce qui rend `data/trajets.db` directement accessible sur l'hôte (inspection et sauvegarde sans entrer dans le conteneur). La terminaison **HTTPS est assurée par un reverse-proxy Caddy externe** (sur une autre machine) qui relaie vers `IP_hôte:2202` ; le backend ne fait donc pas de redirection HTTPS lui-même +### 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. +- **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). + - `logo-horizontal.png` : logo avec texte horizontal, réservé à une utilisation future sur les documents PDF (non encore intégré). + - `favicon.png` : favicon référencé en priorité (``) ; `src/favicon.ico` régénéré à partir de ce PNG (multi-résolutions 16/32/48) pour remplacer l'icône par défaut d'Angular CLI, avec un paramètre de cache-busting (`?v=`) à incrémenter en cas de remplacement futur du visuel. + --- ## Architecture diff --git a/frontend/src/app/app.component.html b/frontend/src/app/app.component.html index abe28a4..36cba01 100644 --- a/frontend/src/app/app.component.html +++ b/frontend/src/app/app.component.html @@ -1,5 +1,9 @@