court/templates/index.html
2024-03-28 11:29:32 +01:00

75 lines
2.4 KiB
HTML

<!DOCTYPE html>
<html lang="en" data-theme="dark">
<head>
<meta charset="UTF-8">
<title>{{.PageTitle}}</title>
<link href="https://cdn.jsdelivr.net/npm/daisyui@4.9.0/dist/full.min.css" rel="stylesheet" type="text/css" />
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://unpkg.com/htmx.org@1.9.11"></script>
</head>
<body>
<header class="flex flex-col w-full p-4 flex gap-4">
<h1 class="grid place-items-center text-5xl font-bold">{{.PageTitle}}</h1>
<input type="checkbox" value="light" class="toggle theme-controller"/>
</header>
<div class="divider"></div>
<div class="flex flex-col w-full p-4 flex gap-4">
<div class="grid place-items-center">
<h2 class="text-xl mt-2">Get a random link</h2>
<form id="randLink">
<div class="grid gap-3">
<label for="url" class="input input-bordered input-md flex items-center gap-2 mt-2">
Enter a URL
<input type="text" name="url" id="url" class="grow" placeholder="https://git.gnous.eu/" required>
</label>
</div>
<div class="grid gap-3 mt-2">
<button class="btn btn-accent" hx-post="/" hx-include="#randLink" hx-target="#randLink" hx-swap="outerHTML">Get Short Link</button>
</div>
</form>
<div class="divider"></div>
<h2 class="text-xl mt-2">Set the path of the link</h2>
<form id="setLink">
<label for="id" class="input input-bordered input-md flex items-center gap-2 mt-2">
Enter an ID
<input type="text" name="id" id="id" class="grow" placeholder="123456" required>
</label>
<label for="url" class="input input-bordered input-md flex items-center gap-2 mt-2">
Enter a URL
<input type="text" name="url" id="url" class="grow" placeholder="https://git.gnous.eu/" required>
</label>
<div class="grid gap-3 mt-2">
<button class="btn btn-accent" hx-post="/" hx-include="#setLink" hx-target="#setLink" hx-swap="outerHTML">Get Short Link</button>
</div>
</form>
</div>
<div class="divider"></div>
<div class="grid place-items-center py-24 px-10">
<table class="table">
<thead>
<tr>
<th>Path</th>
<th>URL</th>
<th>Delete</th>
</tr>
</thead>
{{range .Courts}}
<tbody>
<tr class="hover">
<td>/{{.ID}}</td>
<td>{{.URL}}</td>
<td><button class="btn btn-primary" hx-delete="/{{.ID}}" hx-target="closest tr" hx-swap="outerHTML">X</button></td>
</tr>
</tbody>
{{end}}
</table>
</div>
<div>
</body>
</html>