Pas de photo
Agent mandaté
Exemple — carte grille
620 €
Design system
Galerie vivante : chaque pièce est rendue avec ses variantes et son mode d'emploi. Le code (src/design/composants/) et cette page sont la spécification.
Transparence technique : ces pages ne contiennent aucune ligne de JavaScript de notre part. Notre hébergeur réseau (Cloudflare) injecte en revanche son propre module de détection de robots (jsd) côté navigateur ; ses mesures restent chez lui et ne nous sont pas transmises.
Boutons
Primaire : une seule action principale par écran. Secondaire : actions soutenues. Ghost : actions tertiaires. Disabled : réservé aux états réellement indisponibles.
Badges
Étiquettes d'état courtes, jamais cliquables.
Très bon étatGarantie 6 moisFacture dispoAgent mandaté
Champs
Label toujours visible. L'erreur s'affiche sous le champ en role=alert.
Chips de filtre
Filtrage rapide multi-actif, reflété par aria-pressed.
Infobulle
Aide contextuelle au survol et au focus clavier (CSS pur).
Rang de mainPosition de l'annonce dans la file de traitement de l'agent.
Cartes de catalogue
Variante grille (2 colonnes à 360 px → 5 à 1440 px) et liste compacte. La carte de catalogue porte le badge d'origine : « Occasion — particulier » pour une annonce m2m, « Neuf — marchand partenaire » plus la mention « lien affilié » pour une offre (A58-F1).
Pas de photo
Exemple — carte grille 2
110 €
Pas de visuel
Occasion — particulier
Exemple — annonce
620 €
Pas de visuel
Neuf — marchand partenairelien affilié
Exemple — offre partenaire
96.50 €
Tableau de caractéristiques
Specs en tableau sémantique, lisible sans JS et indexable.
| VRAM | 10 Go GDDR6X |
|---|---|
| Sorties | 3x DP 1.4a |
Rail de messages
Bulles typées : le type est porté par la couleur et la classe (lisible machine).
Pagination
Liens serveur purs (?page=n), aria-current sur la page courante. Les URL viennent du ContexteListe de l'écran appelant (A58-D1).
États et squelettes
Vide : toujours une action de sortie. Squelette : CSS pur, respecte prefers-reduced-motion.