add alphine
This commit is contained in:
6
superpage/src/entrypoint.ts
Normal file
6
superpage/src/entrypoint.ts
Normal file
@@ -0,0 +1,6 @@
|
||||
import type { Alpine } from 'alpinejs'
|
||||
import collapse from '@alpinejs/collapse'
|
||||
|
||||
export default (Alpine: Alpine) => {
|
||||
Alpine.plugin(collapse)
|
||||
}
|
||||
3
superpage/src/env.d.ts
vendored
Normal file
3
superpage/src/env.d.ts
vendored
Normal file
@@ -0,0 +1,3 @@
|
||||
interface Window {
|
||||
Alpine: import('alpinejs').Alpine
|
||||
}
|
||||
@@ -179,15 +179,27 @@ const trainer = data.course?.trainer ? await getEntry(data.course?.trainer) : nu
|
||||
<div class="lg:col-span-2 flex flex-col gap-1.5">
|
||||
{
|
||||
data.course.modules.map((summary) => (
|
||||
<details class="bg-white/10 rounded-lg w-full px-5 py-3 open:bg-white/15 open:[&_svg]:-rotate-180">
|
||||
<summary class="cursor-pointer flex items-center justify-between marker:content-['']">
|
||||
<div
|
||||
x-data="{expanded: false}"
|
||||
class="bg-white/10 rounded-lg w-full px-5 py-3"
|
||||
:class="{'bg-white/15': expanded === true}"
|
||||
>
|
||||
<div
|
||||
@click="expanded = ! expanded"
|
||||
class="cursor-pointer flex items-center justify-between"
|
||||
>
|
||||
<span>{summary}</span>
|
||||
<Icon
|
||||
name="chevron"
|
||||
class="size-4 fill-white/60 group-data-[hover]:fill-white/50 shrink-0"
|
||||
:class="{'-rotate-180': expanded === true}"
|
||||
/>
|
||||
</summary>
|
||||
<div class="text-sm/6 text-white/70 space-y-2 mt-2">
|
||||
</div>
|
||||
<div
|
||||
x-show="expanded"
|
||||
class="text-sm/6 text-white/70 space-y-2 mt-2"
|
||||
style="display: none;"
|
||||
>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet neque id
|
||||
libero semper vulputate a ut ex. Pellentesque semper ultrices mi in efficitur.
|
||||
@@ -198,7 +210,7 @@ const trainer = data.course?.trainer ? await getEntry(data.course?.trainer) : nu
|
||||
sed consequat augue convallis et.
|
||||
</p>
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user