42 lines
1.0 KiB
Plaintext
42 lines
1.0 KiB
Plaintext
package components
|
|
|
|
import "fmt"
|
|
|
|
type ModalProps struct {
|
|
ID string
|
|
Title string
|
|
Open bool
|
|
Content templ.Component
|
|
}
|
|
|
|
templ Modal(props ModalProps) {
|
|
<div
|
|
class="fixed inset-0 z-50 max-w-xl items-center justify-center mx-auto"
|
|
id={ props.ID }
|
|
x-data={ `{ open: ` + fmt.Sprintf("%t", props.Open) + ` }` }
|
|
x-show="open"
|
|
role="dialog"
|
|
aria-modal="true"
|
|
aria-labelledby="modal-title"
|
|
>
|
|
<div class="fixed inset-0 bg-gray-500/50" @click="open = false"></div>
|
|
<div class="flex min-h-full items-center justify-center p-4 pointer-events-none">
|
|
<div class={ "relative bg-base-100 rounded-lg w-full pointer-events-auto" }>
|
|
<div class="flex justify-between items-center p-4 border-b">
|
|
<h2 class="font-bold text-lg" id="modal-title">{ props.Title }</h2>
|
|
<button type="button" class="btn btn-ghost" @click="open = false">✕</button>
|
|
</div>
|
|
<div class="p-4">
|
|
if props.Content != nil {
|
|
@props.Content
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
templ ModalContainer() {
|
|
<div id="modal-container"></div>
|
|
}
|