CSS: testimonial

div[class~="instui-testimonial"] — Lainaus tai suositusnäyttö lähdeviittauksella ja valinnaisella kuvituksella.

✅ Käytä Testimonial-komponenttia kun:

• Näytetään asiakkaiden tai käyttäjien suosituksia ja lainauksia

• Haluat korostaa lausumaa visuaalisella painotuksella

• Lähdeviittaus ja konteksti (nimi, titteli, kuva) ovat tärkeitä 🚫 Älä käytä Testimonial-komponenttia kun:

• Näytetään sisäisiä lainauksia leipätekstissä — käytä sen sijaan blockquote-elementtiä

• Lausuma on pääasiallinen fokus — käytä sen sijaan Hero- tai Card-komponenttia

Saavutettavuus

• Käytä semanttisesti <blockquote> lainaukseen
• Varmista, että lähdeviittaus on selkeä ja yhdistetty lainaukseen
• Jos käytät kuvia, lisää alt-teksti

Käyttö

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

Osat

Osa	Kuvaus
.instui-author	Lähdeviittauksen (tekijän) nimi.
.instui-avatar	Valinnainen tekijän profiilikuva.
.instui-content	Säiliö lainaukselle ja lähdeviittaukselle.
.instui-quote	Lainattu teksti.
.instui-title	Valinnainen tekijän titteli tai organisaatio.

Tilat

Tila	Kuvaus
:optional	—

Käytetyt tokenit

Token	Tyyppi	Arvo
--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	—	—

Liittyvät

• card