Monorepo for Tangled
appview: fix ui inconsistencies
Signed-off-by: eti <eti@eti.tf>
+27
-14
+2
-2
appview/pages/templates/repo/fork.html
+2
-2
appview/pages/templates/repo/fork.html
···
49
49
name="repo_name"
50
50
value="{{ .RepoInfo.Name }}"
51
51
required
52
-
class="flex-1 dark:bg-gray-700 dark:text-white dark:border-gray-600 border border-gray-300 rounded md:rounded-r md:rounded-l-none px-3 py-2"
52
+
class="flex-1 md:rounded-r md:rounded-l-none py-2"
53
53
/>
54
54
</div>
55
55
</div>
···
64
64
value="{{ .RepoInfo.Description }}"
65
65
maxlength="140"
66
66
oninput="document.getElementById('fork-desc-count').textContent = this.value.length + '/140 characters'"
67
-
class="w-full dark:bg-gray-800 dark:text-white dark:border-gray-700 border border-gray-300 rounded px-3 py-2"
67
+
class="w-full py-2"
68
68
placeholder="A brief description of your project..."
69
69
/>
70
70
<p id="fork-desc-count" class="text-sm text-gray-500 dark:text-gray-400 mt-1">{{ len .RepoInfo.Description }}/140 characters</p>
+4
-4
appview/pages/templates/repo/new.html
+4
-4
appview/pages/templates/repo/new.html
···
90
90
id="name"
91
91
name="name"
92
92
required
93
-
class="flex-1 dark:bg-gray-700 dark:text-white dark:border-gray-600 border border-gray-300 rounded md:rounded-r md:rounded-l-none px-3 py-2"
93
+
class="flex-1 md:rounded-r md:rounded-l-none py-2"
94
94
placeholder="repository-name"
95
95
/>
96
96
</div>
···
111
111
id="description"
112
112
name="description"
113
113
maxlength="140"
114
-
class="w-full w-full dark:bg-gray-800 dark:text-white dark:border-gray-700 border border-gray-300 rounded px-3 py-2"
114
+
class="w-full py-2"
115
115
placeholder="A brief description of your project..."
116
116
/>
117
117
<p class="text-sm text-gray-500 dark:text-gray-400 mt-1">
···
132
132
name="branch"
133
133
value="main"
134
134
required
135
-
class="w-full dark:bg-gray-800 dark:text-white dark:border-gray-700 border border-gray-300 rounded px-3 py-2"
135
+
class="w-full py-2"
136
136
/>
137
137
<p class="text-sm text-gray-500 dark:text-gray-400 mt-1">
138
138
The primary branch where development happens. Common choices are "main" or "master".
···
146
146
<label class="block text-sm font-bold uppercase dark:text-white mb-1">
147
147
Select a knot
148
148
</label>
149
-
<div class="w-full dark:bg-gray-800 dark:text-white dark:border-gray-700 border border-gray-300 rounded p-3 space-y-2">
149
+
<div class="w-full space-y-2">
150
150
{{ range .Knots }}
151
151
<div class="flex items-center">
152
152
<input
+2
-3
appview/pages/templates/repo/pulls/fragments/pullNewComment.html
+2
-3
appview/pages/templates/repo/pulls/fragments/pullNewComment.html
···
34
34
{{ define "cancel" }}
35
35
<button
36
36
type="button"
37
-
class="btn text-red-500 dark:text-red-400 flex gap-2 items-center group"
37
+
class="btn-flat text-red-500 dark:text-red-400 flex gap-2 items-center group"
38
38
hx-get="/{{ .RepoInfo.FullName }}/pulls/{{ .Pull.PullId }}/round/{{ .RoundNumber }}/actions"
39
39
hx-swap="outerHTML"
40
40
hx-target="#actions-{{.RoundNumber}}"
···
48
48
<button
49
49
type="submit"
50
50
id="reply-{{ .RoundNumber }}"
51
-
class="btn-create flex items-center gap-2">
51
+
class="btn-create-flat flex items-center gap-2">
52
52
{{ i "reply" "w-4 h-4 inline group-[.htmx-request]:hidden" }}
53
53
{{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }}
54
54
reply
55
55
</button>
56
56
{{ end }}
57
-
+4
-4
appview/pages/templates/strings/fragments/form.html
+4
-4
appview/pages/templates/strings/fragments/form.html
···
16
16
placeholder="Filename"
17
17
required
18
18
value="{{ .String.Filename }}"
19
-
class="md:max-w-64 dark:bg-gray-700 dark:text-white dark:border-gray-600 dark:placeholder-gray-400 px-3 py-2 border rounded"
19
+
class="md:max-w-64"
20
20
>
21
21
<input
22
22
type="text"
···
24
24
name="description"
25
25
value="{{ .String.Description }}"
26
26
placeholder="Description ..."
27
-
class="flex-1 dark:bg-gray-700 dark:text-white dark:border-gray-600 dark:placeholder-gray-400 px-3 py-2 border rounded"
27
+
class="flex-1"
28
28
>
29
29
</div>
30
30
<textarea
31
31
name="content"
32
32
id="content-textarea"
33
33
wrap="off"
34
-
class="w-full dark:bg-gray-800 dark:text-white dark:border-gray-700 dark:placeholder-gray-400 font-mono"
34
+
class="w-full font-mono"
35
35
rows="20"
36
36
spellcheck="false"
37
37
placeholder="Paste your string here!"
···
54
54
<button
55
55
type="submit"
56
56
id="new-button"
57
-
class="w-fit btn-create rounded flex items-center py-0 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600 group"
57
+
class="w-fit btn-create group"
58
58
>
59
59
<span class="inline-flex items-center gap-2">
60
60
{{ i "arrow-up" "w-4 h-4" }}
+15
-1
input.css
+15
-1
input.css
···
241
241
hover:before:shadow-[inset_0_-2px_0_0_theme(colors.gray.900/25%)]
242
242
active:before:shadow-[inset_0_2px_2px_0_theme(colors.gray.900/50%)];
243
243
}
244
+
245
+
.btn-create-flat {
246
+
@apply btn-create
247
+
before:shadow-none
248
+
hover:before:shadow-none
249
+
active:before:shadow-none;
250
+
}
244
251
245
252
.btn-cancel {
246
253
@apply btn text-white
···
250
257
disabled:bg-red-400 dark:disabled:bg-red-600;
251
258
}
252
259
260
+
.btn-cancel-flat {
261
+
@apply btn-cancel
262
+
before:shadow-none
263
+
hover:before:shadow-none
264
+
active:before:shadow-none;
265
+
}
266
+
253
267
.btn-group {
254
268
@apply inline-flex items-stretch
255
269
max-h-[32px]
···
261
275
.btn-group-item {
262
276
@apply btn-flat min-h-[30px] gap-1.5
263
277
bg-gray-50 dark:bg-gray-900
264
-
border-y-0
278
+
rounded-none border-y-0
265
279
no-underline hover:no-underline
266
280
hover:text-gray-600 dark:hover:text-gray-400;
267
281
}