File size: 665 Bytes
8fdc036 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
<script lang="ts">
export let open = true;
export let label = "";
</script>
<button on:click={() => (open = !open)} class="label-wrap" class:open>
<span>{label}</span>
<span style:transform={open ? "rotate(0)" : "rotate(90deg)"} class="icon">
▼
</span>
</button>
<div style:display={open ? "block" : "none"}>
<slot />
</div>
<style>
span {
font-weight: var(--section-header-text-weight);
font-size: var(--section-header-text-size);
}
.label-wrap {
display: flex;
justify-content: space-between;
cursor: pointer;
width: var(--size-full);
}
.label-wrap.open {
margin-bottom: var(--size-2);
}
.icon {
transition: 150ms;
}
</style>
|