Startseite: fast ferting

views/routes/components/_alphabet.gohtml

@@ -4,7 +4,7 @@
 	<div
 		class="flex flex-row border-b px-3 border-zinc-300 items-end min-h-14"
 		x-data="{ search : '{{ $model.search }}' }">
-		<div id="alphabet" class="alphabet flex flex-row items-end">
+		<div id="alphabet" class="alphabet flex flex-row items-end text-xl">
 			{{ range $id, $r := .letters }}
 				<a
 					class="odd:bg-stone-100 even:bg-zinc-100 mr-1 border-zinc-300 border-x border-t [&>a[aria-current='page']]:font-bold
@@ -37,7 +37,7 @@
 					name="search"
 					value="{{ $model.search }}"
 					x-model="search"
-					placeholder="Band-ID od. Suchbegriff"
+					placeholder="Almanach-Nr od. Suchbegriff"
 					hx-get=""
 					hx-trigger="input changed delay:=200ms, keyup[key=='Enter']"
 					hx-select="#searchcontent"

views/routes/components/_reihe.gohtml

@@ -2,20 +2,39 @@
 {{ $r := index . 1 }}
 
 
-<a href="/reihe/{{ $r.MusenalmID }}">{{ $r.Title }}</a>
-<div>
-	{{ Safe $r.Annotation }}
-</div>
-<div>
-	{{ $bds := index $model.relations $r.Id }}
-	{{ if $bds }}
-		{{ range $_, $rel := $bds }}
-			{{ $bd := index $model.entries $rel.Entry }}
-			{{ if $bd }}
-				<div>
-					<a href="/almanach/{{ $bd.MusenalmID }}">{{ $bd.Year }}</a>
-				</div>
-			{{ end }}
+<div class="flex flex-row mb-1.5">
+	<div class="grow-0 shrink-0 w-[12rem] flex flex-col">
+		{{ if $r.References }}
+			<div class="text-sm font-sans px-2 py-1 bg-stone-100">{{ $r.References }}</div>
 		{{ end }}
-	{{ end }}
+		<div class="font-sans py-0.5 text-xs">
+			<a href="/reihe/?={{ $r.Id }}" class="no-underline rounded bg-stone-100 px-1.5">
+				<i class="ri-links-line"></i> Permalink
+			</a>
+		</div>
+	</div>
+	<div class="grow-0 ml-8 -indent-3">
+		<span class="font-bold">{{ $r.Title }}</span>
+		{{ if $r.Annotation }}
+			<span>&ensp;&middot;&ensp;</span>
+			<span class="">{{ Safe $r.Annotation }}</span>
+		{{ end }}
+		<div class="ml-3">
+			{{ $bds := index $model.relations $r.Id }}
+			{{ if $bds }}
+				{{ range $_, $rel := $bds }}
+					{{ $bd := index $model.entries $rel.Entry }}
+					{{ if $bd }}
+						<a href="/almanach/{{ $bd.MusenalmID }}">
+							{{ if ne $bd.Year 0 }}
+								{{ $bd.Year }}
+							{{ else }}
+								[o.J.]
+							{{ end }} </a
+						>&ensp;
+					{{ end }}
+				{{ end }}
+			{{ end }}
+		</div>
+	</div>
 </div>

views/routes/components/_reihenfilter.gohtml

@@ -1,23 +1,42 @@
 {{ $model := . }}
-<div class="min-w-96 max-w-96 float-right flex flex-col gap-y-4">
+<div
+	class="min-w-[32rem] max-w-[32rem] float-right ml-6 flex flex-col gap-y-8 [&>*]:py-12
+	[&>*]:px-12 -mr-36 [&>*]:bg-slate-100">
 	{{ if .agents }}
-		<filter-list
-			id="agent-list"
-			data-url="/reihen/?agent="
-			data-placeholder="Personen und Körperschaften filtern..."></filter-list>
-
+		<div class="">
+			<filter-list
+				id="agent-list"
+				data-url="/reihen/?agent="
+				data-placeholder="Personen und Körperschaften filtern..."></filter-list>
+		</div>
 	<script type="module">
 		let agentList = document.getElementById("agent-list");
-		if (agentList) agentList.items = {{ .agents }};
+		if (agentList) {
+			agentList.items = {{ .agents }};
+
+			agentList.setSearchTextFunc((item) => {
+				return item.name;
+			});
+
+			agentList.setLinkTextFunc((item) => {
+				return `
+						<span class="filter-list-searchable">${item.name}</span>
+						<span class="text-xs text-stone-500 whitespace-nowrap">
+							${item.corporate_body ? "Verlag/Druck/Vertrieb" : item.biographical_data}
+						</span>
+						`;
+			});
+		}
 	</script>
 	{{ end }}
 
 	{{ if .places }}
-		<filter-list
-			id="place-list"
-			data-url="/reihen/?place="
-			data-placeholder="Erscheinungsorte filtern..."></filter-list>
-
+		<div>
+			<filter-list
+				id="place-list"
+				data-url="/reihen/?place="
+				data-placeholder="Erscheinungsorte filtern..."></filter-list>
+		</div>
 	<script type="module">
 		let placeList = document.getElementById("place-list");
 		if (placeList) placeList.items = {{ .places }};
@@ -25,20 +44,20 @@
 	{{ end }}
 
 	{{ if .years }}
-		<filter-list
-			id="year-list"
-			data-url="/reihen/?year="
-			data-filterstart="true"
-			data-placeholder="Erscheinungsjahr filtern..."></filter-list>
-
+		<div>
+			<filter-list
+				id="year-list"
+				data-url="/reihen/?year="
+				data-filterstart="true"
+				data-placeholder="Erscheinungsjahr filtern..."></filter-list>
+		</div>
 	<script type="module">
 		let yearList = document.getElementById("year-list");
 		if (yearList) {
 			yearList.items = {{ .years }};
 
 			yearList.setHREFFunc((item) => {
-				if (item === 0) return "/reihen?year=0";
-				return `/reihen?year=${item}`;
+				return String(item);
 			});
 
 			yearList.setLinkTextFunc((item) => {

views/routes/reihen/body.gohtml

@@ -8,24 +8,24 @@
 	</div>
 </div>
 
-<div class="mt-3">
+<div class="mt-6">
 	{{ template "_reihenfilter" . }}
 </div>
 
-<div id="searchcontent" class="pt-4 font-serif">
+<div id="searchcontent" class="font-serif">
+	<div class="-ml-16">
 	{{ if or .series .altseries }}
-		{{ range $id, $r := .series }}
-			<div class="mb-1.5">
+		<div class="mb-1 max-w-[60rem] hyphens-auto">
+			{{ range $id, $r := .series }}
 				{{ template "_reihe" (Arr $model $r) }}
-			</div>
-		{{ end }}
+			{{ end }}
+		</div>
+		</div>
 
 		{{ if .search }}
-			<div class="mt-8">
+			<div class="mt-8 max-w-96">
 				{{ range $id, $r := .altseries }}
-					<div class="mb-1.5">
 						{{ template "_reihe" (Arr $model $r) }}
-					</div>
 				{{ end }}
 			</div>
 		{{ end }}