go-htmx-examples/deleterow/templates.templ

55 lines
1.2 KiB
Plaintext

package deleterow
import "examples/shared"
templ demo() {
<style>
tr.htmx-swapping td {
opacity: 0;
transition: opacity 1s ease-out;
}
</style>
<table class="table"><thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Status</th>
<th></th>
</tr>
</thead><tbody hx-confirm="Are you sure?" hx-target="closest tr" hx-swap="outerHTML swap:1s">
<tr>
<td>Joe Smith</td>
<td>joe@smith.org</td>
<td>Active</td>
<td><button class="button is-red" hx-delete="/delete-row/contact/0">Delete</button></td>
</tr>
<tr>
<td>Angie MacDowell</td>
<td>angie@macdowell.org</td>
<td>Active</td>
<td><button class="button is-red" hx-delete="/delete-row/contact/1">Delete</button></td>
</tr>
<tr>
<td>Fuqua Tarkenton</td>
<td>fuqua@tarkenton.org</td>
<td>Active</td>
<td><button class="button is-red" hx-delete="/delete-row/contact/2">Delete</button></td>
</tr>
<tr>
<td>Kim Yee</td>
<td>kim@yee.org</td>
<td>Inactive</td>
<td><button class="button is-red" hx-delete="/delete-row/contact/3">Delete</button></td>
</tr>
</tbody></table>
}
templ Index() {
@shared.Layout("Delete Row") {
<h2 class="title">Delete Row</h2>
<h2 class="title">Demo</h2>
@demo()
}
}