Skip to content

CSS: testimonial ​

div[class~="instui-testimonial"] — תצוגת ציטוט או עדות עם שיוך ואפשרות לכלול תמונה.

✅ השתמשו ב‑Testimonial כאשר:

  • הצגת עדויות וציטוטים של לקוחות או משתמשים

  • רוצים להדגיש הצהרה בעזרת הדגשה ויזואלית

  • שיוך והקשר (שם, תפקיד, תמונה) חשובים 🚫 אל תשתמשו ב‑Testimonial כאשר:

  • הצגת ציטוטים מקוטעים בתוך טקסט גוף — השתמשו ברכיב blockquote במקום

  • ההצהרה היא המוקד העיקרי — השתמשו ב‑Hero או ב‑Card במקום

נגישות ​

  • השתמשו ב‑<blockquote> באופן סמנטי לציטוט
  • ודאו שהשיוך ברור ומקושר לציטוט
  • אם משתמשים בתמונות, ספקו טקסט חלופי (alt)

שימוש ​

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

דוגמאות ​

חלקים ​

חלקתיאור
.instui-authorשם המחבר לשיוך.
.instui-avatarתמונת פרופיל של המחבר (אופציונלי).
.instui-contentמיכל לציטוט ולשיוך.
.instui-quoteהטקסט המצוטט.
.instui-titleתפקיד המחבר או שיוך ארגוני (אופציונלי).

מצבים ​

מצבתיאור
:optional—

אסימוני צריכה ​

Tokenסוגערך
--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——

קשור ​