innocuous-symmetry/go-htmx-tailwind-example
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

in progress: adding sqlite support

Browse Source
This commit is contained in:
Mikayla Dobson
2024-03-02 17:13:15 +00:00
parent 35f469d298
commit 99801f0255
13 changed files with 250 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
templates/index.html
View File

@@ -11,10 +11,10 @@
<body>
<main>
<div class="md:container md:mx-auto">
<h1 class="text-3xl">Go + HTMX + Tailwind Example</h1>
<h1 class="text-3xl">Mikayla's Move Manager</h1>
<br/>
<span class="text-xl">Companies</span>
<div>{{ template "companies.html" . }}</div>
<div>{{ template "items.html" . }}</div>
</div>
</main>
</body>

31
templates/item-row.html Normal file
View File

@@ -0,0 +1,31 @@
<tr id="datarow-{{.ID}}" class="border-b dark:border-neutral-500">
<td class="whitespace-nowrap px-6 py-4">{{.ID}}</td>
<td class="whitespace-nowrap px-6 py-4">{{.Name}}</td>
<td class="whitespace-nowrap px-6 py-4">{{.Stage}}</td>
<td class="whitespace-nowrap px-6 py-4">{{.Category}}</td>
<td class="whitespace-nowrap px-6 py-4">{{.Description}}</td>
<td class="whitespace-nowrap px-6 py-4">{{.Notes}}</td>
<td class="whitespace-nowrap px-1 py-1">
<a
hx-get="/company/edit/{{.ID}}"
hx-target="#datarow-{{.ID}}"
hx-swap="outerHTML"
hx-indicator="#processing"
class="hover:underline text-blue-700"
href=""
>
Edit
</a>
</td>
<td class="whitespace-nowrap px-1 py-1">
<a
hx-delete="/company/{{.ID}}"
hx-target="#companies"
hx-confirm="Are you sure you want to delete {{.Company}}?"
hx-indicator="#processing"
class="hover:underline text-blue-700"
href=""
>Delete</a
>
</td>
</tr>

40
templates/items.html Normal file
View File

@@ -0,0 +1,40 @@
<div id="companies">
<div id="processing" class="htmx-indicator">Processing...</div>
<div class="flex flex-col">
<div class="overflow-x-auto sm:-mx-6 lg:-mx-8">
<div class="inline-block min-w-full py-2 sm:px-6 lg:px-8">
<div class="overflow-hidden">
<!-- <div class="flex justify-end">
<button
hx-get="/company/add"
hx-target="#table-body"
hx-swap="outerHTML"
hx-indicator="#processing"
class="inline-flex items-center h-8 px-4 m-2 text-sm text-blue-100 transition-colors duration-150 bg-blue-700 rounded-lg focus:shadow-outline hover:bg-blue-800"
href=""
>
Add
</button>
</div> -->
<table class="min-w-full text-left text-sm font-light">
<thead class="border-b font-medium dark:border-neutral-500">
<tr>
<th scope="col" class="px-6 py-4">#</th>
<th scope="col" class="px-6 py-4">Name</th>
<th scope="col" class="px-6 py-4">Stage</th>
<th scope="col" class="px-6 py-4">Category</th>
<th scope="col" class="px-6 py-4">Description</th>
<th scope="col" class="px-6 py-4">Notes</th>
</tr>
</thead>
<tbody id="table-body">
{{range .}}
{{ template "item-row.html". }}
{{end}}
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>