66 lines (44 loc) · 2.14 KB

Refonte UI/UX du Dashboard - Projet Ricash

Objectif

Appliquer une refonte visuelle complète du Dashboard en utilisant la palette de couleurs officielle de Ricash sans modifier la logique applicative ni la structure actuelle (HTML, composants, layout).

Palette de Couleurs Officielle

Bleu Foncé : #29475B (41, 71, 91)
Doré / Beige : #B19068 (177, 144, 104)
Turquoise : #2B8286 (43, 130, 134)
Blanc Cassé : #F4F2EE (244, 242, 238)
Bleu-Vert : #376470 (55, 100, 112)

Éléments à Refonter

1. Sidebar

Fond principal : Bleu Foncé #29475B.
Icônes actives : Turquoise #2B8286.
Icônes inactives : Blanc Cassé #F4F2EE.
Hover & Sélection : Doré / Beige #B19068 avec un léger effet d'ombre.
Typographie : Blanc Cassé pour les labels.

2. Header

Fond : Bleu-Vert #376470.
Texte & Icônes : Blanc Cassé pour contraste.
Éléments interactifs (boutons, menus) : Turquoise en état actif, Doré / Beige en hover.

3. Dashboard Content

Fond global : Blanc Cassé #F4F2EE.
Cartes & Widgets :
- Fond : Blanc Cassé avec ombre douce bleu-vert #37647033 (20% opacity).
- Titres : Bleu Foncé #29475B.
- Valeurs / KPIs : Turquoise #2B8286.
- Actions : Doré / Beige pour CTA principal.

4. Tables & Listes

En-têtes : Bleu Foncé, texte Blanc Cassé.
Lignes alternées : Blanc Cassé et Turquoise très clair (opacité 5%).
Hover ligne : Fond Doré / Beige très doux.

Guidelines UI/UX

Consistance chromatique : toujours utiliser les couleurs de la palette.
Effets visuels légers : ombres douces, coins arrondis (radius 8-12px).
Lisibilité optimale : fort contraste entre texte et fond.
Sensation premium : Doré / Beige pour les accents, Turquoise pour la modernité.

Points Importants

Aucune modification de la logique applicative.
Aucune modification de la structure du layout.
Seulement un lifting visuel complet basé sur la palette officielle Ricash.