kot.pink
1{{ define "user/completeSignup" }}
2 <!doctype html>
3 <html lang="en" class="dark:bg-gray-900">
4 <head>
5 <meta charset="UTF-8" />
6 <meta
7 name="viewport"
8 content="width=device-width, initial-scale=1.0"
9 />
10 <meta
11 property="og:title"
12 content="complete signup · tangled"
13 />
14 <meta
15 property="og:url"
16 content="https://tangled.sh/complete-signup"
17 />
18 <meta
19 property="og:description"
20 content="complete your signup for tangled"
21 />
22 <script src="/static/htmx.min.js"></script>
23 <link
24 rel="stylesheet"
25 href="/static/tw.css?{{ cssContentHash }}"
26 type="text/css"
27 />
28 <title>complete signup · tangled</title>
29 </head>
30 <body class="flex items-center justify-center min-h-screen">
31 <main class="max-w-md px-6 -mt-4">
32 <h1
33 class="text-center text-2xl font-semibold italic dark:text-white"
34 >
35 tangled
36 </h1>
37 <h2 class="text-center text-xl italic dark:text-white">
38 tightly-knit social coding.
39 </h2>
40 <form
41 class="mt-4 max-w-sm mx-auto flex flex-col gap-4"
42 hx-post="/signup/complete"
43 hx-swap="none"
44 hx-disabled-elt="#complete-signup-button"
45 >
46 <div class="flex flex-col">
47 <label for="code">verification code</label>
48 <input
49 type="text"
50 id="code"
51 name="code"
52 tabindex="1"
53 required
54 placeholder="tngl-sh-foo-bar"
55 />
56 <span class="text-sm text-gray-500 mt-1">
57 Enter the code sent to your email.
58 </span>
59 </div>
60
61 <div class="flex flex-col">
62 <label for="username">username</label>
63 <input
64 type="text"
65 id="username"
66 name="username"
67 tabindex="2"
68 required
69 placeholder="jason"
70 />
71 <span class="text-sm text-gray-500 mt-1">
72 Your complete handle will be of the form <code>user.tngl.sh</code>.
73 </span>
74 </div>
75
76 <div class="flex flex-col">
77 <label for="password">password</label>
78 <input
79 type="password"
80 id="password"
81 name="password"
82 tabindex="3"
83 required
84 />
85 <span class="text-sm text-gray-500 mt-1">
86 Choose a strong password for your account.
87 </span>
88 </div>
89
90 <button
91 class="btn-create w-full my-2 mt-6 text-base"
92 type="submit"
93 id="complete-signup-button"
94 tabindex="4"
95 >
96 <span>complete signup</span>
97 </button>
98 </form>
99 <p id="signup-error" class="error w-full"></p>
100 <p id="signup-msg" class="dark:text-white w-full"></p>
101 </main>
102 </body>
103 </html>
104{{ end }}