ui: fix search dropdown width and alignment

This commit is contained in:
2026-04-06 23:01:48 +02:00
parent 6495bc733a
commit 120e7a1470
2 changed files with 12 additions and 7 deletions

View File

@@ -143,10 +143,10 @@ func (h *Handler) HandleQuickSearch(w http.ResponseWriter, r *http.Request) {
return return
} }
// Limit to 10 results // Limit to 5 results
results := res.Animes results := res.Animes
if len(results) > 10 { if len(results) > 5 {
results = results[:10] results = results[:5]
} }
type SearchResult struct { type SearchResult struct {

View File

@@ -108,8 +108,8 @@ header {
.search-dropdown { .search-dropdown {
position: absolute; position: absolute;
top: 100%; top: 100%;
left: 0;
right: 0; right: 0;
width: 320px;
background: var(--surface); background: var(--surface);
border: 1px solid var(--border); border: 1px solid var(--border);
border-top: none; border-top: none;
@@ -141,6 +141,7 @@ header {
text-decoration: none; text-decoration: none;
color: inherit; color: inherit;
transition: background 0.15s; transition: background 0.15s;
align-items: flex-start;
} }
.search-result-item:hover { .search-result-item:hover {
@@ -163,17 +164,20 @@ header {
justify-content: center; justify-content: center;
background: var(--surface-hover); background: var(--surface-hover);
border: 1px solid var(--border); border: 1px solid var(--border);
font-size: 10px; font-size: 9px;
color: var(--text-muted); color: var(--text-muted);
flex-shrink: 0; flex-shrink: 0;
text-align: center;
padding: 4px;
} }
.search-result-info { .search-result-info {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 2px; gap: 3px;
min-width: 0; min-width: 0;
flex: 1; flex: 1;
padding-top: 2px;
} }
.search-result-title { .search-result-title {
@@ -181,9 +185,10 @@ header {
color: var(--text); color: var(--text);
font-weight: 500; font-weight: 500;
display: -webkit-box; display: -webkit-box;
-webkit-line-clamp: 2; -webkit-line-clamp: 1;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
overflow: hidden; overflow: hidden;
word-break: break-word;
} }
.search-result-type { .search-result-type {