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 "spindleList" . }}
14 </div>
15 </section>
16 </div>
17{{ end }}
18
19{{ define "spindleList" }}
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">Spindle</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 flex items-center gap-2">
40 <p class="text-gray-500 dark:text-gray-400">
41 Spindles are small CI runners.
42 </p>
43</section>
44{{ end }}
45
46{{ define "list" }}
47<section class="rounded w-full flex flex-col gap-2">
48 <h2 class="text-sm font-bold py-2 uppercase dark:text-gray-300">your spindles</h2>
49 <div class="flex flex-col rounded border border-gray-200 dark:border-gray-700 w-full">
50 {{ range $spindle := .Spindles }}
51 {{ template "spindles/fragments/spindleListing" . }}
52 {{ else }}
53 <div class="flex items-center justify-center p-2 border-b border-gray-200 dark:border-gray-700 text-gray-500">
54 no spindles registered yet
55 </div>
56 {{ end }}
57 </div>
58 <div id="operation-error" class="text-red-500 dark:text-red-400"></div>
59</section>
60{{ end }}
61
62{{ define "register" }}
63<section class="rounded w-full lg:w-fit flex flex-col gap-2">
64 <h2 class="text-sm font-bold py-2 uppercase dark:text-gray-300">register a spindle</h2>
65 <p class="mb-2 dark:text-gray-300">Enter the hostname of your spindle to get started.</p>
66 <form
67 hx-post="/settings/spindles/register"
68 class="max-w-2xl mb-2 space-y-4"
69 hx-indicator="#register-button"
70 hx-swap="none"
71 >
72 <div class="flex gap-2">
73 <input
74 type="text"
75 id="instance"
76 name="instance"
77 placeholder="spindle.example.com"
78 required
79 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"
80 >
81 <button
82 type="submit"
83 id="register-button"
84 class="btn rounded flex items-center py-2 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600 group"
85 >
86 <span class="inline-flex items-center gap-2">
87 {{ i "plus" "w-4 h-4" }}
88 register
89 </span>
90 <span class="pl-2 hidden group-[.htmx-request]:inline">
91 {{ i "loader-circle" "w-4 h-4 animate-spin" }}
92 </span>
93 </button>
94</div>
95
96<div id="register-error" class="dark:text-red-400"></div>
97</form>
98
99</section>
100{{ end }}
101
102{{ define "docsButton" }}
103<a
104class="btn flex items-center gap-2"
105href="https://docs.tangled.org/spindles.html#self-hosting-guide">
106{{ i "book" "size-4" }}
107docs
108</a>
109<div
110id="add-email-modal"
111popover
112class="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">
113</div>
114{{ end }}