tjh.dev
forked from
tangled.org/core
Mirror of @tangled.org/core. Running on a Raspberry Pi Zero 2
appview/pages: finesse styling in review page
Signed-off-by: oppiliappan <me@oppi.li>
oppi.li
+2
-1
appview/pages/templates/repo/issues/fragments/issueCommentHeader.html
+2
-1
appview/pages/templates/repo/issues/fragments/issueCommentHeader.html
···
1
1
{{ define "repo/issues/fragments/issueCommentHeader" }}
2
2
<div class="flex flex-wrap items-center gap-2 text-sm text-gray-500 dark:text-gray-400 ">
3
-
{{ resolve .Comment.Did }}
3
+
{{ $handle := resolve .Comment.Did }}
4
+
<a class="text-gray-500 dark:text-gray-400 hover:text-gray-500 dark:hover:text-gray-300" href="/{{ $handle }}">{{ $handle }}</a>
4
5
{{ template "hats" $ }}
5
6
<span class="before:content-['·']"></span>
6
7
{{ template "timestamp" . }}
+1
-1
appview/pages/templates/repo/issues/fragments/newComment.html
+1
-1
appview/pages/templates/repo/issues/fragments/newComment.html
+1
-1
appview/pages/templates/repo/issues/fragments/replyIssueCommentPlaceholder.html
+1
-1
appview/pages/templates/repo/issues/fragments/replyIssueCommentPlaceholder.html
···
8
8
/>
9
9
{{ end }}
10
10
<input
11
-
class="w-full p-0 border-none focus:outline-none"
11
+
class="w-full p-0 border-none focus:outline-none bg-transparent"
12
12
placeholder="Leave a reply..."
13
13
hx-get="/{{ .RepoInfo.FullName }}/issues/{{ .Issue.IssueId }}/comment/{{ .Comment.Id }}/reply"
14
14
hx-trigger="focus"
+36
-13
appview/pages/templates/repo/pulls/pull.html
+36
-13
appview/pages/templates/repo/pulls/pull.html
···
148
148
md:bg-white md:dark:bg-gray-800
149
149
drop-shadow-sm
150
150
border-t md:border-x md:border-t-0 border-gray-200 dark:border-gray-700">
151
-
<h2 class="">Comments</h2>
151
+
<h2 class="">History</h2>
152
152
{{ template "subsPanelSummary" $ }}
153
153
</summary>
154
154
<div class="max-h-[85vh] md:max-h-[calc(100vh-3rem-3rem)] w-full flex flex-col-reverse gap-4 overflow-y-auto bg-slate-100 dark:bg-gray-900 md:bg-transparent">
···
161
161
{{ define "subsPanelSummary" }}
162
162
{{ $root := index . 2 }}
163
163
{{ $pull := $root.Pull }}
164
-
{{ $latest := $pull.LastRoundNumber }}
164
+
{{ $rounds := len $pull.Submissions }}
165
+
{{ $comments := $pull.TotalComments }}
165
166
<div class="flex items-center gap-2 text-sm">
167
+
<span>
168
+
{{ $rounds }} round{{ if ne $rounds 1 }}s{{ end }}
169
+
</span>
170
+
<span class="select-none before:content-['\00B7']"></span>
171
+
<span>
172
+
{{ $comments }} comment{{ if ne $comments 1 }}s{{ end }}
173
+
</span>
174
+
166
175
<span class="md:hidden inline">
167
-
<span class="inline group-open/panel:hidden">{{ i "chevron-up" "size-4" }}</span>
168
-
<span class="hidden group-open/panel:inline">{{ i "chevron-down" "size-4" }}</span>
176
+
<span class="inline group-open:hidden">{{ i "chevron-up" "size-4" }}</span>
177
+
<span class="hidden group-open:inline">{{ i "chevron-down" "size-4" }}</span>
169
178
</span>
170
179
</div>
171
180
{{ end }}
···
231
222
{{ $idx := index . 1 }}
232
223
{{ $lastIdx := index . 2 }}
233
224
{{ $root := index . 3 }}
234
-
<div class="{{ if eq $item.RoundNumber 0 }}rounded-b border-t-0{{ else }}rounded{{ end }} border border-gray-200 dark:border-gray-700 w-full shadow-sm bg-gray-50 dark:bg-gray-900">
225
+
{{ $round := $item.RoundNumber }}
226
+
<div class="
227
+
w-full shadow-sm bg-gray-50 dark:bg-gray-900 border-2 border-t-0
228
+
{{ if eq $round 0 }}rounded-b{{ else }}rounded{{ end }}
229
+
{{ if eq $round $root.ActiveRound }}
230
+
border-blue-200 dark:border-blue-700
231
+
{{ else }}
232
+
border-gray-200 dark:border-gray-700
233
+
{{ end }}
234
+
">
235
235
{{ template "submissionHeader" $ }}
236
236
{{ template "submissionComments" $ }}
237
237
</div>
···
254
236
<div class="
255
237
{{ if eq $round 0 }}rounded-b{{ else }}rounded{{ end }}
256
238
px-6 py-4 pr-2 pt-2
257
-
{{ if eq $root.ActiveRound $round }}
258
-
bg-blue-100 dark:bg-blue-900 border-b border-blue-200 dark:border-blue-700
239
+
bg-white dark:bg-gray-800
240
+
{{ if eq $round $root.ActiveRound }}
241
+
border-t-2 border-blue-200 dark:border-blue-700
259
242
{{ else }}
260
-
bg-white dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700
243
+
border-b-2 border-gray-200 dark:border-gray-700
261
244
{{ end }}
262
245
flex gap-2 sticky top-0 z-20">
263
246
<!-- left column: just profile picture -->
···
288
269
{{ $round := $item.RoundNumber }}
289
270
<div class="flex gap-2 items-center justify-between mb-1">
290
271
<span class="inline-flex items-center gap-2 text-sm text-gray-500 dark:text-gray-400 pt-2">
291
-
{{ resolve $root.Pull.OwnerDid }} submitted
292
-
<span class="px-2 py-0.5 {{ if eq $root.ActiveRound $round }}text-white bg-blue-600 dark:bg-blue-500 border-blue-700 dark:border-blue-600{{ else }}text-black dark:text-white bg-gray-100 dark:bg-gray-700 border-gray-300 dark:border-gray-600{{ end }} rounded font-mono text-xs border">
272
+
{{ $handle := resolve $root.Pull.OwnerDid }}
273
+
<a class="text-gray-500 dark:text-gray-400 hover:text-gray-500 dark:hover:text-gray-300" href="/{{ $handle }}">{{ $handle }}</a>
274
+
submitted
275
+
<span class="px-2 py-0.5 text-black dark:text-white bg-gray-100 dark:bg-gray-700 border-gray-300 dark:border-gray-600 rounded font-mono text-xs border">
293
276
#{{ $round }}
294
277
</span>
295
278
<span class="select-none before:content-['\00B7']"></span>
···
516
495
{{ $idx := index . 1 }}
517
496
{{ $lastIdx := index . 2 }}
518
497
{{ $root := index . 3 }}
498
+
{{ $round := $item.RoundNumber }}
519
499
{{ $c := len $item.Comments }}
520
-
<details class="relative ml-10 group/comments" open>
500
+
<details class="relative ml-10 group/comments" {{ if or (eq $c 0) (eq $root.ActiveRound $round) }}open{{ end }}>
521
501
<summary class="cursor-pointer list-none">
522
502
<div class="hidden group-open/comments:block absolute -left-8 top-0 bottom-0 w-16 transition-colors flex items-center justify-center group/border z-4">
523
503
<div class="absolute left-1/2 -translate-x-1/2 top-0 bottom-0 w-0.5 group-open/comments:bg-gray-200 dark:group-open/comments:bg-gray-700 group-hover/border:bg-gray-400 dark:group-hover/border:bg-gray-500 transition-colors"> </div>
···
576
554
<div class="flex-1 min-w-0">
577
555
<!-- Row 1: Author and timestamp -->
578
556
<div class="text-sm text-gray-500 dark:text-gray-400 flex items-center gap-1">
579
-
<span>{{ resolve .OwnerDid }}</span>
557
+
{{ $handle := resolve .OwnerDid }}
558
+
<a class="text-gray-500 dark:text-gray-400 hover:text-gray-500 dark:hover:text-gray-300" href="/{{ $handle }}">{{ $handle }}</a>
580
559
<span class="before:content-['·']"></span>
581
560
<a class="text-gray-500 dark:text-gray-400 hover:text-gray-500 dark:hover:text-gray-300" href="#comment-{{.ID}}">
582
-
{{ template "repo/fragments/time" .Created }}
561
+
{{ template "repo/fragments/shortTime" .Created }}
583
562
</a>
584
563
</div>
585
564
<!-- Row 2: Body text -->
+2
-2
input.css
+2
-2
input.css
···
93
93
@apply block text-gray-900 text-sm font-bold py-2 uppercase dark:text-gray-100;
94
94
}
95
95
input {
96
-
@apply border border-gray-400 block rounded bg-gray-50 focus:ring-black p-3 dark:bg-gray-800 dark:border-gray-600 dark:text-white dark:focus:ring-gray-400;
96
+
@apply p-3 border border-gray-100 block rounded bg-gray-50 focus:outline-none focus:ring-1 focus:ring-gray-200 p-3 dark:bg-gray-800 dark:border-gray-600 dark:text-white dark:focus:ring-gray-400;;
97
97
}
98
98
textarea {
99
-
@apply border border-gray-400 block rounded bg-gray-50 focus:outline-none focus:ring-1 focus:ring-black p-3 dark:bg-gray-800 dark:border-gray-600 dark:text-white dark:focus:ring-gray-400;
99
+
@apply border border-gray-100 block rounded bg-gray-50 focus:outline-none focus:ring-1 focus:ring-gray-200 p-3 dark:bg-gray-800 dark:border-gray-600 dark:text-white dark:focus:ring-gray-400;
100
100
}
101
101
details summary::-webkit-details-marker {
102
102
display: none;