forked from
tangled.org/core
Mirror of @tangled.org/core. Running on a Raspberry Pi Zero 2 (Please be gentle).
appview/pages: add sidebar to issues with labels and participants list
Signed-off-by: oppiliappan <me@oppi.li>
+58
-24
+58
-24
appview/pages/templates/repo/issues/issue.html
+58
-24
appview/pages/templates/repo/issues/issue.html
···
9
9
{{ end }}
10
10
11
11
{{ define "repoContentLayout" }}
12
-
<div class="grid grid-cols-1 md:grid-cols-4 gap-4 w-full">
13
-
<div class="col-span-1 md:col-span-3">
12
+
<div class="grid grid-cols-1 md:grid-cols-10 gap-4 w-full">
13
+
<div class="col-span-1 md:col-span-8">
14
14
<section class="bg-white dark:bg-gray-800 p-6 rounded relative w-full mx-auto dark:text-white">
15
15
{{ block "repoContent" . }}{{ end }}
16
16
</section>
17
17
{{ block "repoAfter" . }}{{ end }}
18
18
</div>
19
-
<div class="col-span-1 flex flex-col gap-6">
19
+
<div class="col-span-1 md:col-span-2 flex flex-col gap-6">
20
20
{{ template "issueLabels" . }}
21
21
{{ template "issueParticipants" . }}
22
22
</div>
···
30
30
{{ if .Issue.Body }}
31
31
<article id="body" class="mt-4 prose dark:prose-invert">{{ .Issue.Body | markdown }}</article>
32
32
{{ end }}
33
-
<div class="flex flex-wrap gap-2 items-stretch">
33
+
<div class="flex flex-wrap gap-2 items-stretch mt-4">
34
34
{{ template "issueReactions" . }}
35
-
{{ template "issueLabels" . }}
36
35
</div>
37
36
</section>
38
37
{{ end }}
···
119
120
{{ end }}
120
121
121
122
{{ define "issueLabels" }}
122
-
{{ range $k, $valset := $.Issue.Labels.Inner }}
123
-
{{ $d := index $.LabelDefs $k }}
124
-
{{ range $v, $s := $valset }}
125
-
{{ template "labels/fragments/label" (dict "def" $d "val" $v) }}
126
-
{{ end }}
127
-
{{ end }}
123
+
<div>
124
+
<div class="text-sm py-1 flex items-center gap-2 font-bold text-gray-500 dark:text-gray-400 capitalize">
125
+
Labels
126
+
<button
127
+
class="inline-flex text-gray-500 dark:text-gray-400 {{ if not (or .RepoInfo.Roles.IsOwner .RepoInfo.Roles.IsCollaborator) }}hidden{{ end }}"
128
+
popovertarget="add-label-modal"
129
+
popovertargetaction="toggle">
130
+
{{ i "plus" "size-4" }}
131
+
</button>
132
+
</div>
133
+
<div class="flex gap-1 items-center flex-wrap">
134
+
{{ range $k, $valset := $.Issue.Labels.Inner }}
135
+
{{ $d := index $.LabelDefs $k }}
136
+
{{ range $v, $s := $valset }}
137
+
{{ template "labels/fragments/label" (dict "def" $d "val" $v) }}
138
+
{{ end }}
139
+
{{ else }}
140
+
<p class="text-gray-500 dark:text-gray-400 ">No labels yet.</p>
141
+
{{ end }}
128
142
129
-
<button
130
-
class="btn text-gray-500 dark:text-gray-400"
131
-
popovertarget="add-label-modal"
132
-
{{ if not (or .RepoInfo.Roles.IsOwner .RepoInfo.Roles.IsCollaborator) }}disabled{{ end }}
133
-
popovertargetaction="toggle">
134
-
{{ i "plus" "size-4" }}
135
-
</button>
136
-
<div
137
-
id="add-label-modal"
138
-
popover
139
-
class="bg-white w-full sm:w-96 dark:bg-gray-800 p-6 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">
140
-
{{ template "repo/fragments/addLabelModal" (dict "root" $ "subject" $.Issue.AtUri.String "state" $.Issue.Labels) }}
143
+
<div
144
+
id="add-label-modal"
145
+
popover
146
+
class="bg-white w-full sm:w-[30rem] dark:bg-gray-800 p-6 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">
147
+
{{ template "repo/fragments/addLabelModal" (dict "root" $ "subject" $.Issue.AtUri.String "state" $.Issue.Labels) }}
148
+
</div>
149
+
</div>
150
+
</div>
151
+
{{ end }}
152
+
153
+
{{ define "issueParticipants" }}
154
+
{{ $all := .Issue.Participants }}
155
+
{{ $ps := take $all 5 }}
156
+
<div>
157
+
<div class="py-1 flex items-center text-sm">
158
+
<span class="font-bold text-gray-500 dark:text-gray-400 capitalize">Participants</span>
159
+
<span class="bg-gray-200 dark:bg-gray-700 rounded py-1/2 px-1 ml-1">{{ len $all }}</span>
160
+
</div>
161
+
<div class="flex items-center -space-x-2 mt-2">
162
+
{{ $c := "z-50 z-40 z-30 z-20 z-10" }}
163
+
{{ range $i, $p := $ps }}
164
+
<img
165
+
src="{{ tinyAvatar . }}"
166
+
alt=""
167
+
class="rounded-full h-8 w-8 mr-1 border-2 border-gray-300 dark:border-gray-700 z-{{sub 5 $i}}0"
168
+
/>
169
+
{{ end }}
170
+
171
+
{{ if gt (len $all) 5 }}
172
+
<span class="pl-4 text-gray-500 dark:text-gray-400 text-sm">
173
+
+{{ sub (len $all) 5 }}
174
+
</span>
175
+
{{ end }}
176
+
</div>
141
177
</div>
142
178
{{ end }}
143
179
···
188
154
}}
189
155
190
156
{{ template "repo/issues/fragments/newComment" . }}
191
-
<div>
157
+
</div>
192
158
{{ end }}