Redmage/views/components/notification.templ

58 lines
1.3 KiB
Plaintext
Raw Normal View History

package components
const NotificationContainerID = "#notification-container"
templ NotificationContainer() {
<div id="notification-container" class="toast max-xs:toast-top max-xs:toast-end z-50">
{ children... }
</div>
}
templ InfoNotication(messages ...string) {
<div
x-data="{ init() { setTimeout(() => $el.remove(), 5000) } }"
onclick="this.remove()"
>
<div class="alert alert-info hover:bg-info-content transition-all">
for i, message := range messages {
<span>{ message }</span>
if i != len(messages) - 1 {
<br/>
}
}
</div>
</div>
}
templ ErrorNotication(messages ...string) {
<div
x-data="{ init() { setTimeout(() => $el.remove(), 5000) } }"
onclick="this.remove()"
>
<div class="alert alert-error hover:bg-error-content transition-all">
for i, message := range messages {
<span>{ message }</span>
if i != len(messages) - 1 {
<br/>
}
}
</div>
</div>
}
templ SuccessNotification(messages ...string) {
<div
x-data="{ init() { setTimeout(() => $el.remove(), 5000) } }"
onclick="this.remove()"
>
<div class="alert alert-success hover:bg-success-content transition-all">
for i, message := range messages {
<span>{ message }</span>
if i != len(messages) - 1 {
<br/>
}
}
</div>
</div>
}