---
// Port of preview/pages/accordion.html (layout: default)
import DefaultLayout from '@shared/layouts/DefaultLayout.astro';
import Accordion from '@shared/components/ui/Accordion.astro';
---

<DefaultLayout title="Accordion" pageHeader="Accordion" pageMenu="base.accordion">
	<div class="row row-cards">
		<div class="col-md-6">
			<div class="card">
				<div class="card-body">
					<Accordion />
				</div>
			</div>
		</div>
		<div class="col-md-6">
			<div class="card">
				<Accordion type="flush" id="flush" />
			</div>
		</div>
		<div class="col-md-6">
			<div class="card">
				<div class="card-body">
					<Accordion type="tabs" id="tabs" />
				</div>
			</div>
		</div>
		<div class="col-md-6">
			<div class="card">
				<div class="card-body">
					<Accordion type="inverted" id="inverted" />
				</div>
			</div>
		</div>
		<div class="col-md-6">
			<div class="card">
				<div class="card-body">
					<Accordion id="inverted-plus" type="inverted,plus" toggleIcon="plus" />
				</div>
			</div>
		</div>
		<div class="col-md-6">
			<div class="card">
				<div class="card-body">
					<Accordion id="icons" showIcon />
				</div>
			</div>
		</div>
	</div>
</DefaultLayout>