jensroemer.com
forked from
tangled.org/core
Monorepo for Tangled — https://tangled.org
more htmxing
anirudh.fi
+141
-102
+2
-2
appview/pages/templates/knot.html
+2
-2
appview/pages/templates/knot.html
···
14
14
<code>registered on: {{.Registration.Registered}}</code>
15
15
{{ else }}
16
16
<code>pending registration</code>
17
-
<button hx-post="/knots/{{.Domain}}/init">initialize</button>
17
+
<button class="btn my-2" hx-post="/knots/{{.Domain}}/init" hx-swap="none">initialize</button>
18
18
{{ end }}
19
19
</p>
20
20
···
34
34
<form hx-put="/knots/{{.Registration.Domain}}/member">
35
35
<label for="member">did or handle:</label>
36
36
<input type="text" id="member" name="member" required>
37
-
<button type="text">add member</button>
37
+
<button class="btn my-2" type="text">add member</button>
38
38
</form>
39
39
{{ end }}
40
40
{{end}}
+39
-28
appview/pages/templates/knots.html
+39
-28
appview/pages/templates/knots.html
···
1
-
{{define "title"}}knots{{end}}
1
+
{{ define "title" }}knots{{ end }}
2
2
3
-
{{define "content"}}
3
+
{{ define "content" }}
4
4
<h1>knots</h1>
5
5
6
6
<h2>register</h2>
7
7
put in a domain, and use the key while booting up your knotserver
8
8
<form hx-post="/knots/key">
9
9
<label for="domain">domain:</label>
10
-
<input type="text" id="domain" name="domain" required>
11
-
<button type="text">generate key</button>
10
+
<input type="text" id="domain" name="domain" required />
11
+
<button class="btn my-2" type="text">generate key</button>
12
12
</form>
13
13
14
14
<h3>my knots</h3>
15
15
<ul id="my-knots">
16
-
{{range .Registrations}}
17
-
{{ if .Registered }}
18
-
<li>
19
-
<code>domain: <a href="/knots/{{.Domain}}">{{.Domain}}</a></code><br>
20
-
<code>opened by: {{.ByDid}}</code><br>
21
-
<code>on: {{.Created}}</code><br>
22
-
<code>registered on: {{.Registered}}</code>
23
-
</li>
24
-
{{ end }}
25
-
{{else}}
16
+
{{ range .Registrations }}
17
+
{{ if .Registered }}
18
+
<li>
19
+
<code
20
+
>domain:
21
+
<a href="/knots/{{ .Domain }}">{{ .Domain }}</a></code
22
+
><br />
23
+
<code>opened by: {{ .ByDid }}</code><br />
24
+
<code>on: {{ .Created }}</code><br />
25
+
<code>registered on: {{ .Registered }}</code>
26
+
</li>
27
+
{{ end }}
28
+
{{ else }}
26
29
<p>you don't have any knots yet</p>
27
-
{{end}}
30
+
{{ end }}
28
31
</ul>
29
32
<h3>pending registrations</h3>
30
33
<ul id="pending-registrations">
31
-
{{range .Registrations}}
32
-
{{ if not .Registered }}
33
-
<li>
34
-
<code>domain: <a href="/knots/{{.Domain}}">{{.Domain}}</a></code><br>
35
-
<code>opened by: {{.ByDid}}</code><br>
36
-
<code>on: {{.Created}}</code><br>
37
-
<code>pending registration</code>
38
-
<button hx-post="/knots/{{.Domain}}/init">initialize</button>
39
-
</li>
40
-
{{ end }}
41
-
{{else}}
34
+
{{ range .Registrations }}
35
+
{{ if not .Registered }}
36
+
<li>
37
+
<code
38
+
>domain:
39
+
<a href="/knots/{{ .Domain }}">{{ .Domain }}</a></code
40
+
><br />
41
+
<code>opened by: {{ .ByDid }}</code><br />
42
+
<code>on: {{ .Created }}</code><br />
43
+
<code>pending registration</code>
44
+
<button
45
+
class="btn my-2"
46
+
hx-post="/knots/{{ .Domain }}/init"
47
+
>
48
+
initialize
49
+
</button>
50
+
</li>
51
+
{{ end }}
52
+
{{ else }}
42
53
<p>no registrations yet</p>
43
-
{{end}}
54
+
{{ end }}
44
55
</ul>
45
-
{{end}}
56
+
{{ end }}
+43
-14
appview/pages/templates/layouts/topbar.html
+43
-14
appview/pages/templates/layouts/topbar.html
···
1
1
{{ define "layouts/topbar" }}
2
-
3
-
{{ with .LoggedInUser }}
4
-
<nav>
5
-
<a href="/">timeline</a> ·
6
-
<a href="/settings">settings</a> ·
7
-
<a href="/knots">knots</a> ·
8
-
<a href="/repo/new">add repos</a> ·
9
-
{{ if .Handle }}
10
-
<a href="/@{{ .Handle }}">my profile</a>
2
+
{{ with .LoggedInUser }}
3
+
<nav class="flex items-center space-x-4">
4
+
<a
5
+
href="/"
6
+
hx-boost="true"
7
+
class="text-gray-600 hover:text-gray-900"
8
+
>timeline</a
9
+
>
10
+
<a
11
+
href="/settings"
12
+
hx-boost="true"
13
+
class="text-gray-600 hover:text-gray-900"
14
+
>settings</a
15
+
>
16
+
<a
17
+
href="/knots"
18
+
hx-boost="true"
19
+
class="text-gray-600 hover:text-gray-900"
20
+
>knots</a
21
+
>
22
+
<a
23
+
href="/repo/new"
24
+
hx-boost="true"
25
+
class="text-gray-600 hover:text-gray-900"
26
+
>add repos</a
27
+
>
28
+
{{ if .Handle }}
29
+
<a
30
+
href="/@{{ .Handle }}"
31
+
hx-boost="true"
32
+
class="text-gray-600 hover:text-gray-900"
33
+
>my profile</a
34
+
>
35
+
{{ else }}
36
+
<a
37
+
href="/{{ .Did }}"
38
+
hx-boost="true"
39
+
class="text-gray-600 hover:text-gray-900"
40
+
>my profile</a
41
+
>
42
+
{{ end }}
43
+
</nav>
11
44
{{ else }}
12
-
<a href="/{{ .Did }}">my profile</a>
45
+
<a href="/login" class="btn my-2">login</a>
13
46
{{ end }}
14
-
</nav>
15
-
{{ else }}
16
-
<button onclick="window.location.href='/login'">login</button>
17
-
{{ end }}
18
47
19
48
{{ end }}
+11
-12
appview/pages/templates/new-repo.html
+11
-12
appview/pages/templates/new-repo.html
···
1
-
{{define "title"}}new repo{{end}}
1
+
{{ define "title" }}new repo{{ end }}
2
2
3
-
{{define "content"}}
4
-
<h1>new repo</h1>
5
-
<form method="POST" action="/repo/new">
6
-
<label for="name">repo name</label>
7
-
<input type="text" id="name" name="name" required>
3
+
{{ define "content" }}
4
+
<h1>new repo</h1>
5
+
<form method="POST" action="/repo/new">
6
+
<label for="name">repo name</label>
7
+
<input type="text" id="name" name="name" required />
8
8
9
-
<label for="domain">domain</label>
10
-
<input type="domain" id="domain" name="domain" required>
9
+
<label for="domain">domain</label>
10
+
<input type="domain" id="domain" name="domain" required />
11
11
12
-
<button type="submit">create repo</button>
13
-
</form>
14
-
{{end}}
15
-
12
+
<button class="btn my-2" type="submit">create repo</button>
13
+
</form>
14
+
{{ end }}
+15
-15
appview/pages/templates/repo/settings.html
+15
-15
appview/pages/templates/repo/settings.html
···
2
2
<h3>settings</h3>
3
3
<em>collaborators</em>
4
4
<ol>
5
-
{{ range .Collaborators }}
6
-
<li>
7
-
{{ index . 0 }} - {{ index . 3 }}
8
-
</li>
9
-
{{ else }}
10
-
<p>no members</p>
11
-
{{ end }}
5
+
{{ range .Collaborators }}
6
+
<li>
7
+
{{ index . 0 }} -
8
+
{{ index . 3 }}
9
+
</li>
10
+
{{ else }}
11
+
<p>no members</p>
12
+
{{ end }}
12
13
</ol>
13
14
14
15
{{ if .IsCollaboratorInviteAllowed }}
15
-
<h3>add collaborator</h3>
16
-
<form hx-put="/{{ $.RepoInfo.FullName }}/settings/collaborator">
17
-
<label for="collaborator">did or handle:</label>
18
-
<input type="text" id="collaborator" name="collaborator" required>
19
-
<button type="text">add collaborator</button>
20
-
</form>
16
+
<h3>add collaborator</h3>
17
+
<form hx-put="/{{ $.RepoInfo.FullName }}/settings/collaborator">
18
+
<label for="collaborator">did or handle:</label>
19
+
<input type="text" id="collaborator" name="collaborator" required />
20
+
<button class="btn my-2" type="text">add collaborator</button>
21
+
</form>
21
22
{{ end }}
22
-
{{end}}
23
-
23
+
{{ end }}
+19
-14
appview/pages/templates/settings/keys.html
+19
-14
appview/pages/templates/settings/keys.html
···
1
-
{{define "title"}}settings{{end}}
1
+
{{ define "title" }}settings{{ end }}
2
2
3
-
{{define "content"}}
3
+
{{ define "content" }}
4
4
<h1>settings</h1>
5
5
6
6
<h2>profile</h2>
7
-
<p><strong>handle:</strong> {{.LoggedInUser.Handle}}</p>
8
-
<p><strong>did:</strong> {{.LoggedInUser.Did}}</p>
9
-
<p><strong>pds:</strong> {{.LoggedInUser.Pds}}</p>
7
+
<p><strong>handle:</strong> {{ .LoggedInUser.Handle }}</p>
8
+
<p><strong>did:</strong> {{ .LoggedInUser.Did }}</p>
9
+
<p><strong>pds:</strong> {{ .LoggedInUser.Pds }}</p>
10
10
11
11
<h2>ssh keys</h2>
12
12
<form hx-put="/settings/keys">
13
13
<label for="name">key name:</label>
14
-
<input type="text" id="name" name="name" required>
14
+
<input type="text" id="name" name="name" required />
15
15
16
16
<label for="key">pub key:</label>
17
-
<textarea id="key" name="key" placeholder="ssh-rsa AAAAAA..." required></textarea>
17
+
<textarea
18
+
id="key"
19
+
name="key"
20
+
placeholder="ssh-rsa AAAAAA..."
21
+
required
22
+
></textarea>
18
23
19
-
<button type="submit">add key</button>
24
+
<button class="btn my-2" type="submit">add key</button>
20
25
</form>
21
26
22
27
<h3>existing keys</h3>
23
28
<ul id="key-list">
24
-
{{range .PubKeys}}
29
+
{{ range .PubKeys }}
25
30
<li>
26
-
<strong>{{.Name}}</strong><br>
27
-
<code>{{.Key}}</code>
31
+
<strong>{{ .Name }}</strong><br />
32
+
<code>{{ .Key }}</code>
28
33
</li>
29
-
{{else}}
34
+
{{ else }}
30
35
<p>no ssh keys added yet</p>
31
-
{{end}}
36
+
{{ end }}
32
37
</ul>
33
-
{{end}}
38
+
{{ end }}
+1
-6
appview/pages/templates/user/login.html
+1
-6
appview/pages/templates/user/login.html
+11
-11
input.css
+11
-11
input.css
···
27
27
@layer components {
28
28
.btn {
29
29
@apply relative z-10 inline-flex min-h-[36px] cursor-pointer items-center
30
-
justify-center border-0 bg-transparent px-3 pb-[0.3rem] text-base
31
-
text-gray-800 before:absolute before:inset-0 before:-z-10
32
-
before:block before:rounded before:border before:border-cyan-200
33
-
before:bg-white before:shadow-[0_4px_3px_0_rgba(20,20,96,0.1),inset_0_-5px_0_0_#ebebf6]
34
-
before:content-[''] hover:before:border-cyan-600
35
-
hover:before:bg-cyan-600
36
-
hover:before:shadow-[0_4px_3px_0_rgba(20,20,96,0.1),inset_0_-5px_0_0_#c2b3ff]
37
-
focus:outline-none focus-visible:before:outline
38
-
focus-visible:before:outline-4 focus-visible:before:outline-[#fc440f]
39
-
active:border-t-4 active:border-transparent active:py-1
40
-
active:before:shadow-none;
30
+
justify-center border-0 bg-transparent px-3 pb-[0.3rem] text-base
31
+
text-gray-900 before:absolute before:inset-0 before:-z-10
32
+
before:block before:rounded-sm before:border before:border-blue-200
33
+
before:bg-white before:shadow-[0_4px_3px_0_rgba(20,20,96,0.1),inset_0_-5px_0_0_#e5edff]
34
+
before:content-[''] hover:before:border-blue-300
35
+
hover:before:bg-blue-50
36
+
hover:before:shadow-[0_4px_3px_0_rgba(20,20,96,0.1),inset_0_-5px_0_0_#e5edff]
37
+
focus:outline-none focus-visible:before:outline
38
+
focus-visible:before:outline-4 focus-visible:before:outline-blue-500
39
+
active:border-t-4 active:border-transparent active:py-1
40
+
active:before:shadow-none;
41
41
}
42
42
}
43
43