22 lines
745 B
HTML
22 lines
745 B
HTML
|
<ul id="todos" class="shadow-lg grid grid-cols-1 gap-2">
|
||
|
{{range $index, $task := . }}
|
||
|
<li id={{$task.Id}} class="p-4 rounded-xl bg-slate-100">
|
||
|
<input type="checkbox" {{if $task.Completed}}checked{{end}}
|
||
|
hx-post="/toggle-todo/{{$task.Id}}" hx-swap="outerHTML" hx-target="#todos">
|
||
|
{{$task.Title}}
|
||
|
<button class="bg-red-500"
|
||
|
hx-delete="/todo/{{$task.Id}}" hx-swap="outerHTML" hx-target="#todos">X</button>
|
||
|
</li>
|
||
|
{{end}}
|
||
|
<li>
|
||
|
<form class="p-4 rounded-xl bg-slate-100" hx-post="/todos" hx-swap="outerHTML" hx-target="#todos">
|
||
|
<label class="flex p-4">
|
||
|
Title:
|
||
|
<input type="text" name="title" class="grow" ></input>
|
||
|
<button name="submit" class="bg-sky-500">Add</button>
|
||
|
</label>
|
||
|
</form>
|
||
|
|
||
|
</li>
|
||
|
</ul>
|