26 lines
798 B
Plaintext

package components
templ Modal(show bool) {
<div
id="modal"
class={
"flex justify-center items-center",
"fixed inset-0",
"backdrop-blur-sm bg-black/30",
templ.KV("hidden", !show) }>
<div class="border border-muted rounded">
<div class="relative">
<button id="close" class="absolute top-2 right-2 w-fit text-muted hover:text-reset">X</button>
{ children... }
</div>
</div>
<script type="text/javascript" id="modal-js">
htmx.on("#close", "click", function () {
const modal = htmx.find("#modal")
modal.replaceChildren([])
modal.classList.add("hidden")
})
</script>
</div>
}