12 lines
717 B
Plaintext
12 lines
717 B
Plaintext
component Drawer {
|
||
props {
|
||
title = "Panel"
|
||
open = false
|
||
side = "right"
|
||
}
|
||
state visible = open
|
||
view {
|
||
<div data-show="visible" class="fixed inset-0 z-50" role="dialog" aria-modal="true"><button class="absolute inset-0 bg-slate-950/50" aria-label="Close" @click="visible = false"></button><aside class="absolute inset-y-0 w-[min(92vw,28rem)] overflow-auto bg-white p-6 shadow-2xl transition dark:bg-slate-900 {side === 'left' ? 'left-0' : 'right-0'}"><header class="flex items-center justify-between"><h2 class="text-xl font-bold">{title}</h2><button @click="visible = false" class="size-10 rounded-xl hover:bg-slate-100">×</button></header><div class="mt-6"><slot /></div></aside></div>
|
||
}
|
||
}
|