Polissage visuel du portfolio
Avant d'écrire toute modification d'interface, relisez CLAUDE.md — en particulier la section « Design system » — et suivez chaque règle.
Non-négociables
- Pas de dégradés pour les fondus de couleur décoratifs. La séparation bicolore du héros et les surcouches de grille à 1px sont les seules utilisations autorisées de la syntaxe de dégradé.
- Pas de texte contouré (
-webkit-text-stroke). Utilisezitalic+ couleur d'accent pour l'emphase à la place. - Pas de classe de fond
apple-grid. Chaque section possède son propre token--bg-<section>. - Les étiquettes restent discrètes —
.tag+ variante de couleur, jamais de rubans bruyants avec des ombres décalées. - Les cartes utilisent
.chunky-card— pas de bordures colorées par carte. - La barre de navigation est transparente en haut de page, devient pleine au défilement — jamais entièrement pleine en haut (elle chevaucherait la lampe).
- Freelance, pas étudiante — Lamia s'identifie comme ingénieure logicielle freelance dans les textes du héros/pied-de-page/à propos.
Avant de valider toute modification visuelle
- Les titres d'affichage utilisent la classe
.display+ un span en italique de couleur d'accent (suivant le motif « Projets en vedette ») - Les nouvelles cartes utilisent
.chunky-card, pas de bordures faites à la main - Les nouvelles étiquettes utilisent
.tag tag-<couleur>, uniquement avec des variantes pastel douces - Les fonds de section utilisent les tokens
--bg-<section> - Pas d'écrans de chargement, pas d'animations lourdes, pas de formes décoratives flottantes
- Exécuté
npm run build— propre
En cas de doute
- Optez pour discret plutôt que bruyant.
- Les remplissages pleins + les bordures fines priment sur les fondus de dégradé.
- Les accents SVG dessinés à la main (étoiles, gribouillis) conviennent ; les formes vectorielles génériques et libres de droits, non.
- cassie.codes + kawe.ski sont les esthétiques de référence.