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——

Связанные ​