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 "emailSettings" . }}
14 </div>
15 </section>
16 </div>
17{{ end }}
18
19{{ define "emailSettings" }}
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">Email Addresses</h2>
23 <p class="text-gray-500 dark:text-gray-400">
24 Commits authored using emails listed here will be associated with your Tangled profile.
25 </p>
26 </div>
27 <div class="col-span-1 md:col-span-1 md:justify-self-end">
28 {{ template "addEmailButton" . }}
29 </div>
30 </div>
31 <div class="flex flex-col rounded border border-gray-200 dark:border-gray-700 divide-y divide-gray-200 dark:divide-gray-700 w-full">
32 {{ range .Emails }}
33 {{ template "user/settings/fragments/emailListing" (list $ .) }}
34 {{ else }}
35 <div class="flex items-center justify-center p-2 text-gray-500">
36 no emails added yet
37 </div>
38 {{ end }}
39 </div>
40{{ end }}
41
42{{ define "addEmailButton" }}
43 <button
44 class="btn flex items-center gap-2"
45 popovertarget="add-email-modal"
46 popovertargetaction="toggle">
47 {{ i "plus" "size-4" }}
48 add email
49 </button>
50 <div
51 id="add-email-modal"
52 popover
53 class="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">
54 {{ template "addEmailModal" . }}
55 </div>
56{{ end}}
57
58{{ define "addEmailModal" }}
59<form
60 hx-put="/settings/emails"
61 hx-indicator="#spinner"
62 hx-swap="none"
63 class="flex flex-col gap-2"
64>
65 <label for="email-address" class="uppercase p-0">
66 add email
67 </label>
68 <p class="text-sm text-gray-500 dark:text-gray-400">Commits using this email will be associated with your profile.</p>
69 <input
70 type="email"
71 id="email-address"
72 name="email"
73 required
74 placeholder="your@email.com"
75 class="w-full dark:bg-gray-700 dark:text-white dark:border-gray-600 dark:placeholder-gray-400"
76 />
77 <div class="flex gap-2 pt-2">
78 <button
79 type="button"
80 popovertarget="add-email-modal"
81 popovertargetaction="hide"
82 class="btn w-1/2 flex items-center gap-2 text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300"
83 >
84 {{ i "x" "size-4" }} cancel
85 </button>
86 <button type="submit" class="btn w-1/2 flex items-center">
87 <span class="inline-flex gap-2 items-center">{{ i "plus" "size-4" }} add</span>
88 <span id="spinner" class="group">
89 {{ i "loader-circle" "ml-2 w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }}
90 </span>
91 </button>
92 </div>
93 <div id="settings-emails-error" class="text-red-500 dark:text-red-400"></div>
94 <div id="settings-emails-success" class="text-green-500 dark:text-green-400"></div>
95</form>
96{{ end }}