Monorepo for Tangled
appview: use shared repoCard in quick-search results
Adds a compact mode (6th positional arg) to repoCard that skips
minimum height and applies focus-within highlight for keyboard nav.
Signed-off-by: eti <eti@eti.tf>
+8
-37
+1
-34
appview/pages/templates/search/fragments/quick.html
+1
-34
appview/pages/templates/search/fragments/quick.html
···
30
30
31
31
{{define "search/fragments/quickPage"}}
32
32
{{- range .Repos -}}
33
-
{{ template "search/fragments/quickItem" . }}
33
+
{{ template "user/fragments/repoCard" (list $ . true false (dict) true) }}
34
34
{{- end -}}
35
-
{{end}}
36
-
37
-
{{define "search/fragments/quickItem"}}
38
-
{{ $owner := resolve .Did }}
39
-
<a href="/{{ $owner }}/{{ .Name }}"
40
-
data-nav-result
41
-
class="flex flex-col gap-1.5 px-4 py-3 hover:bg-gray-100 dark:hover:bg-gray-700/50 focus:bg-gray-100 dark:focus:bg-gray-700/50 focus:outline-none no-underline hover:no-underline last:border-b last:border-gray-200 dark:last:border-gray-700">
42
-
<div class="flex items-center gap-2 font-medium text-gray-800 dark:text-gray-200">
43
-
{{ i "book-marked" "size-4 pt-0.5 text-gray-400" }}
44
-
<span class="truncate">{{ $owner }}/{{ .Name }}</span>
45
-
</div>
46
-
{{- with .Description -}}
47
-
<div class="text-sm text-gray-500 dark:text-gray-400 line-clamp-2 pl-6">{{ . }}</div>
48
-
{{- end -}}
49
-
{{- with .RepoStats -}}
50
-
{{- if or .Language .StarCount .IssueCount.Open .PullCount.Open -}}
51
-
<div class="flex gap-3 items-center text-xs text-gray-400 pl-6 font-mono">
52
-
{{- with .Language -}}
53
-
<span class="flex items-center gap-1">{{ template "repo/fragments/colorBall" (dict "color" (langColor .)) }}{{ . }}</span>
54
-
{{- end -}}
55
-
{{- with .StarCount -}}
56
-
<span class="flex items-center gap-1">{{ i "star" "w-3 h-3" }} {{ . }}</span>
57
-
{{- end -}}
58
-
{{- with .IssueCount.Open -}}
59
-
<span class="flex items-center gap-1">{{ i "circle-dot" "w-3 h-3" }} {{ . }}</span>
60
-
{{- end -}}
61
-
{{- with .PullCount.Open -}}
62
-
<span class="flex items-center gap-1">{{ i "git-pull-request" "w-3 h-3" }} {{ . }}</span>
63
-
{{- end -}}
64
-
</div>
65
-
{{- end -}}
66
-
{{- end -}}
67
-
</a>
68
35
{{end}}
69
36
70
37
{{define "search/fragments/quickFooter"}}
+7
-3
appview/pages/templates/user/fragments/repoCard.html
+7
-3
appview/pages/templates/user/fragments/repoCard.html
···
5
5
{{ $fullName := index . 2 }}
6
6
{{ $starButton := false }}
7
7
{{ $starData := dict }}
8
+
{{ $compact := false }}
8
9
{{ if gt (len .) 3 }}
9
10
{{ $starButton = index . 3 }}
10
11
{{ if gt (len .) 4 }}
11
12
{{ $starData = index . 4 }}
13
+
{{ if gt (len .) 5 }}
14
+
{{ $compact = index . 5 }}
15
+
{{ end }}
12
16
{{ end }}
13
17
{{ end }}
14
18
15
19
{{ with $repo }}
16
-
<div class="py-4 px-6 gap-1 flex flex-col drop-shadow-sm bg-white dark:bg-gray-800 min-h-32">
20
+
<div class="{{ if not $compact }} min-h-32 {{ end }} {{ if $compact }} focus-within:bg-gray-100 dark:focus-within:bg-gray-800/80 {{ end }} py-4 px-6 gap-1 flex flex-col drop-shadow-sm bg-white dark:bg-gray-800">
17
21
<div class="font-medium dark:text-white flex items-center justify-between">
18
22
<div class="flex items-center min-w-0 flex-1 mr-2">
19
23
{{ if .Source }}
···
23
27
{{ end }}
24
28
{{ $repoOwner := resolve .Did }}
25
29
{{- if $fullName -}}
26
-
<a href="/{{ $repoOwner }}/{{ .Name }}" class="truncate min-w-0">{{ $repoOwner }}/{{ .Name }}</a>
30
+
<a href="/{{ $repoOwner }}/{{ .Name }}" data-nav-result class="truncate min-w-0 {{ if $compact }} focus:outline-none {{ end }}">{{ $repoOwner }}/{{ .Name }}</a>
27
31
{{- else -}}
28
-
<a href="/{{ $repoOwner }}/{{ .Name }}" class="truncate min-w-0">{{ .Name }}</a>
32
+
<a href="/{{ $repoOwner }}/{{ .Name }}" data-nav-result class="truncate min-w-0 {{ if $compact }} focus:outline-none {{ end }}">{{ .Name }}</a>
29
33
{{- end -}}
30
34
</div>
31
35
{{ if and $starButton $root.LoggedInUser }}