this repo has no description
tangled.org
1{{ define "title" }}knots{{ end }}
2
3{{ define "content" }}
4<div class="px-6 py-4 flex items-end justify-start gap-4 align-bottom">
5 <h1 class="text-xl font-bold dark:text-white">Knots</h1>
6
7 <span class="flex items-center gap-1 text-sm">
8 {{ i "book" "w-3 h-3" }}
9 <a href="https://tangled.sh/@tangled.sh/core/blob/master/docs/knot-hosting.md">
10 docs
11 </a>
12 </span>
13</div>
14
15<section class="bg-white dark:bg-gray-800 p-6 rounded relative w-full mx-auto drop-shadow-sm dark:text-white">
16 <div class="flex flex-col gap-6">
17 {{ block "about" . }} {{ end }}
18 {{ block "list" . }} {{ end }}
19 {{ block "register" . }} {{ end }}
20 </div>
21</section>
22{{ end }}
23
24{{ define "about" }}
25<section class="rounded">
26 <p class="text-gray-500 dark:text-gray-400">
27 Knots are lightweight headless servers that enable users to host Git repositories with ease.
28 When creating a repository, you can choose a knot to store it on.
29 </p>
30
31
32</section>
33{{ end }}
34
35{{ define "list" }}
36 <section class="rounded w-full flex flex-col gap-2">
37 <h2 class="text-sm font-bold py-2 uppercase dark:text-gray-300">your knots</h2>
38 <div class="flex flex-col rounded border border-gray-200 dark:border-gray-700 w-full">
39 {{ range $registration := .Registrations }}
40 {{ template "knots/fragments/knotListing" . }}
41 {{ else }}
42 <div class="flex items-center justify-center p-2 border-b border-gray-200 dark:border-gray-700 text-gray-500">
43 no knots registered yet
44 </div>
45 {{ end }}
46 </div>
47 <div id="operation-error" class="text-red-500 dark:text-red-400"></div>
48 </section>
49{{ end }}
50
51{{ define "register" }}
52 <section class="rounded w-full lg:w-fit flex flex-col gap-2">
53 <h2 class="text-sm font-bold py-2 uppercase dark:text-gray-300">register a knot</h2>
54 <p class="mb-2 dark:text-gray-300">Enter the hostname of your knot to get started.</p>
55 <form
56 hx-post="/knots/register"
57 class="max-w-2xl mb-2 space-y-4"
58 hx-indicator="#register-button"
59 hx-swap="none"
60 >
61 <div class="flex gap-2">
62 <input
63 type="text"
64 id="domain"
65 name="domain"
66 placeholder="knot.example.com"
67 required
68 class="flex-1 w-full dark:bg-gray-700 dark:text-white dark:border-gray-600 dark:placeholder-gray-400 px-3 py-2 border rounded"
69 >
70 <button
71 type="submit"
72 id="register-button"
73 class="btn rounded flex items-center py-2 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600 group"
74 >
75 <span class="inline-flex items-center gap-2">
76 {{ i "plus" "w-4 h-4" }}
77 register
78 </span>
79 <span class="pl-2 hidden group-[.htmx-request]:inline">
80 {{ i "loader-circle" "w-4 h-4 animate-spin" }}
81 </span>
82 </button>
83 </div>
84
85 <div id="register-error" class="error dark:text-red-400"></div>
86 </form>
87
88 </section>
89{{ end }}