FAQ
The FAQ component displays a section containing frequently asked questions and their corresponding answers.
Props
The FAQ component accepts the following props:
faqs(array of FAQItem, required): An array of FAQItem objects representing the questions and answers.
FAQItem
The FAQItem interface has the following structure:
interface FAQItem {
question: string;
answer: string;
}question(string, required): The question text.answer(string, required): The answer text.
Usage Example
<FAQ faqs={[
{
question: 'Lorem ipsum dolor sit amet, consectetur.',
answer:
'We provide digital experience services to startups and small businesses. We help our clients succeed by creating brand identities, digital experiences.',
},
{
question: 'Lorem ipsum dolor sit amet, consectetur.',
answer:
'We provide digital experience services to startups and small businesses. We help our clients succeed by creating brand identities, digital experiences.',
},
{
question: 'Lorem ipsum dolor sit amet, consectetur.',
answer:
'We provide digital experience services to startups and small businesses. We help our clients succeed by creating brand identities, digital experiences.',
},
]} />In the example above, the FAQ component is used to render a section with frequently asked questions and their corresponding answers. The faqs prop is passed an array of FAQItem objects containing the questions and answers. You can customize the content of the FAQs by modifying the data passed to the faqs prop.
Styling
The FAQ component uses Tailwind CSS utility classes for styling. You can customize the component's appearance by modifying these classes or extending them with your own styles.
For more information on Tailwind CSS, refer to the official documentation: https://tailwindcss.com/docs
Last updated
Was this helpful?