wandering-eye/src/lib/Accordion/Accordion.svelte

30 lines
579 B
Svelte

<script lang="ts">
import AccordionItem from './AccordionItem.svelte'
export let name: string | null = null
export let open = false
export let id: string
</script>
<div class="accordion">
{#if name}
<AccordionItem {id} {name} {open} noPadding>
<slot />
</AccordionItem>
{:else}
<slot />
{/if}
</div>
<style lang="postcss">
.accordion {
overflow: hidden;
border-radius: 0.5rem;
}
.accordion > :global(:nth-child(odd)) {
background-color: var(--lighten-10);
}
.accordion > :global(:nth-child(even)) {
background-color: var(--lighten-15);
}
</style>