File tree Expand file tree Collapse file tree 1 file changed +4
-16
lines changed Expand file tree Collapse file tree 1 file changed +4
-16
lines changed Original file line number Diff line number Diff line change 1
1
<script lang =" ts" >
2
- import { slide } from ' svelte/transition' ;
3
- import { quintOut } from ' svelte/easing' ;
4
-
5
- import ChevronDown from ' svelte-material-icons/ChevronDown.svelte' ;
6
-
7
2
export let title: string ;
8
- let expanded: boolean = false ;
9
3
</script >
10
4
11
5
<div class =" desktop-only" >
16
10
</div >
17
11
18
12
<div class =" mobile-only" >
19
- <!-- svelte-ignore a11y-click-events-have-key-events -->
20
- <button class ="title" on:click ={() => (expanded = ! expanded )}>
13
+ <button class =" title" >
21
14
<span >
22
15
{title }
23
16
</span >
24
- <div class ="arrow" style:transform ={expanded ? ' rotate(180deg)' : ' rotate(0deg)' }>
25
- <ChevronDown size =" 24px" color =" var(--surface-six)" />
26
- </div >
27
17
</button >
28
- {#if expanded }
29
- <ul transition:slide ={{ easing : quintOut , duration : 500 }}>
30
- <slot />
31
- </ul >
32
- {/if }
18
+ <ul >
19
+ <slot />
20
+ </ul >
33
21
</div >
34
22
35
23
<style lang =" scss" >
You can’t perform that action at this time.
0 commit comments