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

संबंधित