52 lines
2.6 KiB
Handlebars
52 lines
2.6 KiB
Handlebars
|
<!doctype html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>kode-viewer</title>
|
||
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
||
|
|
</head>
|
||
|
|
<div class="flex flex-col h-full w-full">
|
||
|
|
{{> navbar}}
|
||
|
|
<main class="flex flex-col items-center h-full w-full my-5 gap-4">
|
||
|
|
<form class="flex h-10 w-1/2" action="/kode/find" method="POST">
|
||
|
|
<div class="flex flex-row justify-center items-center h h-full w-full gap-4">
|
||
|
|
<input
|
||
|
|
class="flex w-5/6 bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 w-full rounded-lg px-4 py-2 border border-neutral-400 focus:border-primary focus:ring-primary"
|
||
|
|
placeholder="Search items..."
|
||
|
|
type="search"
|
||
|
|
id="pattern"
|
||
|
|
name="pattern"
|
||
|
|
required
|
||
|
|
/>
|
||
|
|
<button type="submit" class="h-10 rounded-md text-md w-1/6 bg-blue-500 hover:bg-blue-700 text-white font-bold border border-blue-700 rounded">
|
||
|
|
Search
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
<div class="w-full gap-4">
|
||
|
|
<a class="w-full flex justify-center items-center" href="/kode/create">
|
||
|
|
<button class="h-10 rounded-md text-md w-1/2 bg-blue-500 hover:bg-blue-700 text-white font-bold border border-blue-700 rounded">
|
||
|
|
Create
|
||
|
|
</button>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
{{#if kodes}}
|
||
|
|
{{#each kodes}}
|
||
|
|
<a href="/kode/{{ this.id }}" class="block flex flex-col p-6 w-1/2 bg-white border border-gray-200 rounded-lg shadow hover:bg-gray-100 gap-2 justify-center items-center">
|
||
|
|
<h5 class="mb-2 text-2xl font-bold tracking-tight">{{ this.name }}</h5>
|
||
|
|
<div class="gap-1">
|
||
|
|
<span class="bg-blue-500 text-white text-md font-medium me-2 px-2.5 py-1 rounded-full">{{ this.kind }}</span>
|
||
|
|
<span class="bg-gray-900 text-white text-md font-medium me-2 px-2.5 py-1 rounded-full">{{ this.email }}</span>
|
||
|
|
<span class="bg-blue-500 text-white text-md font-medium me-2 px-2.5 py-1 rounded-full">{{ this.lang }}</span>
|
||
|
|
</div>
|
||
|
|
</a>
|
||
|
|
{{/each}}
|
||
|
|
{{else}}
|
||
|
|
<div class="flex flex-col items-center justify-center gap-4">
|
||
|
|
<h1 class="text-muted-foreground text-gray-500 md:text-xl">No kodes found</h1>
|
||
|
|
</div>
|
||
|
|
{{/if}}
|
||
|
|
</main>
|
||
|
|
</div>
|
||
|
|
</html>
|