CSS: testimonial ​

div[class~="instui-testimonial"] — Affichage de citation ou témoignage avec attribution et images facultatives.

✅ Utiliser Testimonial lorsque :

  • Afficher des témoignages et citations de clients ou d'utilisateurs

  • Vous voulez mettre en valeur une déclaration avec une emphase visuelle

  • L'attribution et le contexte (nom, titre, image) sont importants 🚫 Ne pas utiliser Testimonial lorsque :

  • Afficher des citations en ligne dans le texte — utilisez plutôt un élément blockquote

  • La déclaration est le point principal — utilisez plutôt Hero ou Card

Accessibilité ​

  • Use <blockquote> semantically for the quote
  • Ensure attribution is clear and associated with the quote
  • If using images, provide alt text

Utilisation ​

css
@import "@pantoken/plugin-layouts/layouts.css";

Exemples ​

Parties ​

PartieDescription
.instui-authorNom de l'auteur pour l'attribution.
.instui-avatarImage de profil de l'auteur (facultative).
.instui-contentConteneur pour la citation et l'attribution.
.instui-quoteLe texte cité.
.instui-titleTitre ou affiliation de l'auteur (facultatif).

États ​

ÉtatDescription
:optional—

Jetons consommés ​

TokenTypeValeur
--instui-color-background——
--instui-color-primary——
--instui-color-surface——
--instui-color-text-primary——
--instui-color-text-secondary——
--instui-font-size-small<length>—
--instui-font-weight-semibold——
--instui-radius-medium——
--instui-space-large——
--instui-space-medium——
--instui-space-small——

Liés ​