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