Static path, search dropdown, async follow

This commit is contained in:
2026-07-15 10:46:22 +02:00
committed by david.alvarez
parent f4d0055c18
commit 9103de3312
14 changed files with 64 additions and 36 deletions
+17 -18
View File
@@ -4,38 +4,37 @@
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>DiscDrop</title>
<link rel="icon" type="image/svg+xml" href="/static/img/favicon.svg"/>
<link rel="icon" type="image/svg+xml" href="/img/favicon.svg"/>
<link rel="alternate" type="application/rss+xml" title="DiscDrop New Releases" href="/rss"/>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/full.min.css" rel="stylesheet" type="text/css"/>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://unpkg.com/[email protected]"></script>
<link rel="stylesheet" href="/static/css/app.css"/>
<script src="/static/js/app.js" defer></script>
<link rel="stylesheet" href="/css/app.css"/>
<script src="/js/app.js" defer></script>
</head>
<body>
<header class="sticky top-0 z-30 bg-base-100/90 backdrop-blur border-b border-base-300">
<div class="navbar flex flex-wrap justify-center gap-4 px-4 py-3 max-w-5xl mx-auto">
<div class="flex items-center gap-2">
<img src="/static/img/logo.svg" alt="DiscDrop logo" class="h-9 w-9"/>
<img src="/img/logo.svg" alt="DiscDrop logo" class="h-9 w-9"/>
<span class="text-xl font-bold">DiscDrop</span>
</div>
<div id="search-wrap" class="relative flex-1 min-w-[220px] max-w-xl">
<form id="search-form" class="join w-full" autocomplete="off">
<input
id="search-input"
type="search"
name="q"
placeholder="Search MusicBrainz artists…"
class="input input-bordered join-item w-full"
hx-get="/search/artists"
hx-trigger="input changed delay:300ms"
hx-target="#search-dropdown"
hx-swap="innerHTML"
hx-include="this"/>
</form>
<input
id="search-input"
type="text"
name="q"
placeholder="Search MusicBrainz artists…"
class="input input-bordered w-full"
autocomplete="off"
hx-get="/search/artists"
hx-trigger="input changed delay:300ms"
hx-target="#search-dropdown"
hx-swap="innerHTML"
hx-include="this"/>
<div id="search-dropdown"
class="absolute left-0 right-0 z-40 mt-1 bg-base-100 rounded-box shadow-lg border border-base-300 max-h-96 overflow-y-auto"></div>
class="absolute left-0 right-0 top-full z-40 mt-1 bg-base-100 rounded-box shadow-lg border border-base-300 max-h-96 overflow-y-auto"></div>
</div>
<div class="flex items-center gap-2">