izquiratops.bsky.social
English/Japanese dictionary
empty results template fix, style changes
+34
-20
+12
-1
internal/adapters/primary/http/templates/base.html
+12
-1
internal/adapters/primary/http/templates/base.html
···
1
1
<!DOCTYPE html>
2
2
<html lang="en">
3
+
3
4
<head>
4
5
<meta charset="UTF-8">
5
6
<meta name="viewport" content="width=device-width, initial-scale=1.0">
···
7
8
<link rel="icon" type="image/png" sizes="32x32" href="/static/favicon.ico">
8
9
<link rel="stylesheet" href="/static/css/style.css">
9
10
<script src="/static/js/htmx.min.js"></script>
11
+
<script>
12
+
document.addEventListener('keydown', (e) => {
13
+
if (e.key === '/') {
14
+
alert('!'); // TODO: Implement search focus here. But move it to a js file.
15
+
e.preventDefault(); // Prevent "/" from being typed into the input
16
+
}
17
+
});
18
+
</script>
10
19
</head>
20
+
11
21
<body>
12
22
<div class="container">
13
23
{{block "content" .}}{{end}}
14
24
</div>
15
25
</body>
16
-
</html>
26
+
27
+
</html>
+2
-2
internal/adapters/primary/http/templates/partials/search_results.html
+2
-2
internal/adapters/primary/http/templates/partials/search_results.html
···
1
-
{{if .Entries}}
1
+
{{if and .Entries (gt (len .Entries) 0)}}
2
2
<div class="results-list">
3
3
<p class="results-count">Found {{len .Entries}} entries</p>
4
4
···
46
46
</div>
47
47
{{else}}
48
48
<div class="no-results">
49
-
<p>{{if .Error}}{{.Error}}{{else}}No results found. Try another search term.{{end}}</p>
49
+
<p>No results found. Try another search term.</p>
50
50
</div>
51
51
{{end}}
+7
-2
internal/application/usecases/search.go
+7
-2
internal/application/usecases/search.go
···
35
35
36
36
func (uc *SearchUseCase) Execute(ctx context.Context, req *SearchRequest) (*SearchResponse, error) {
37
37
ids, _ := uc.index.Search(req.Term, req.Limit)
38
-
entries, _ := uc.repo.GetByIDs(ctx, ids)
39
-
return &SearchResponse{Entries: entries}, nil
38
+
39
+
if len(ids) == 0 {
40
+
return &SearchResponse{Entries: nil}, nil
41
+
} else {
42
+
entries, _ := uc.repo.GetByIDs(ctx, ids)
43
+
return &SearchResponse{Entries: entries}, nil
44
+
}
40
45
}
+13
-15
web/static/css/style.css
+13
-15
web/static/css/style.css
···
4
4
--font-size: 1rem;
5
5
6
6
/* Color */
7
-
--background-color: #fff;
8
-
--layout-separator-color: #e0e0e0;
9
-
--layout-form-color: #ccc;
7
+
--background-color: #99D19C;
10
8
--text-main-color: #000;
11
-
--text-accent-color: #0066cc;
9
+
--text-accent-color: #73AB84;
12
10
--text-alt-color: #666;
13
11
14
12
/* Spacing */
···
73
71
}
74
72
75
73
.search-container input[type="search"] {
76
-
width: 100%;
77
-
padding: var(--spacing-sm);
74
+
border-radius: 2px;
75
+
border: 2px solid black;
76
+
box-shadow: 6px 6px 0px 0px black;
78
77
font-size: var(--font-size-md);
79
-
border: 2px solid var(--layout-form-color);
80
-
border-radius: 6px;
78
+
padding: var(--spacing-sm);
79
+
width: 100%;
81
80
}
82
81
83
82
.search-container input[type="search"]:focus {
···
113
112
}
114
113
115
114
.entry {
116
-
border-bottom: 2px solid var(--layout-separator-color);
117
-
padding-bottom: var(--spacing-xl);
115
+
background: white;
116
+
border: 2px solid black;
117
+
border-radius: 2px;
118
+
box-shadow: 6px 6px 0px 0px black;
119
+
padding: var(--spacing-md);
120
+
margin-bottom: var(--spacing-xl);
118
121
}
119
122
120
123
.entry:last-child {
···
169
172
font-size: var(--font-size-sm);
170
173
color: var(--text-alt-color);
171
174
margin-bottom: var(--spacing-xxs);
172
-
}
173
-
174
-
.glosses {
175
-
list-style: disc;
176
-
padding-left: var(--spacing-lg);
177
175
}
178
176
179
177
.gloss {