TwigcnBundle

Accordion

A vertically stacked set of interactive headings that reveal content.

Default

Is it accessible?
Yes. It adheres to the WAI-ARIA design pattern using the native HTML details element.
Is it styled?
Yes. It comes with default styles that match the other components' aesthetic.
Is it animated?
Yes. It uses CSS transitions for smooth open/close animations.

FAQ Example

How do I create an account?
Click the "Sign Up" button in the top right corner and follow the registration process. You'll need to provide your email address and create a password.
Can I change my subscription plan?
Yes, you can upgrade or downgrade your plan at any time from your account settings. Changes will take effect at the start of your next billing cycle.
What payment methods do you accept?
We accept all major credit cards (Visa, MasterCard, American Express), PayPal, and bank transfers for annual plans.
How do I contact support?
You can reach our support team via email at support@example.com or through the live chat feature available in your dashboard.

Usage

<twig:Accordion>
    <twig:AccordionItem title="Section 1" :open="true">
        Content for section 1
    </twig:AccordionItem>
    <twig:AccordionItem title="Section 2">
        Content for section 2
    </twig:AccordionItem>
</twig:Accordion>