mirror of
https://github.com/Theodor-Springmann-Stiftung/musenalm.git
synced 2025-10-29 17:25:32 +00:00
Personenliste fertig
This commit is contained in:
@@ -1,203 +1,102 @@
|
||||
{{ $model := . }}
|
||||
|
||||
{{ $isPerson := and $model.filter (or (eq $model.filter "noorg") (eq $model.filter "musik") (eq $model.filter "autor") (eq $model.filter "graphik") (eq $model.filter "hrsg")) }}
|
||||
|
||||
{{ $isNoOrg := and $model.filter (eq $model.filter "noorg") }}
|
||||
|
||||
{{ $isOrg := and $model.filter (eq $model.filter "org") }}
|
||||
|
||||
{{ $isMusik := and $model.filter (eq $model.filter "musik") }}
|
||||
|
||||
{{ $isAutor := and $model.filter (eq $model.filter "autor") }}
|
||||
|
||||
{{ $isGraphik := and $model.filter (eq $model.filter "graphik") }}
|
||||
|
||||
{{ $isHrsg := and $model.filter (eq $model.filter "hrsg") }}
|
||||
|
||||
|
||||
<!-- INFO: 1. Container -->
|
||||
<div class="container-normal mt-4" x-data="{ search : '{{ $model.search }}'}">
|
||||
{{- if not $model.search -}}
|
||||
<div
|
||||
id="persontype"
|
||||
class="flex flex-row justify-end align-right text-right mr-4 gap-x-3"
|
||||
:class="search ? 'inactive' : ''">
|
||||
<a
|
||||
href="/personen{{ if .letter }}?letter={{ .letter }}{{ end }}"
|
||||
{{ if $isPerson -}}aria-current="page"{{- end -}}
|
||||
>Personen</a
|
||||
>
|
||||
|
||||
<a
|
||||
href="/personen?filter=org{{ if .letter }}&letter={{ .letter }}{{ end }}"
|
||||
{{ if $isOrg -}}aria-current="page"{{- end -}}
|
||||
>Verlage, Druckereien & Vertriebe</a
|
||||
>
|
||||
</div>
|
||||
{{- end -}}
|
||||
{{ template "menu" . }}
|
||||
|
||||
|
||||
<!-- INFO: 2. Spalten-Layout -->
|
||||
<div class="flex flex-row">
|
||||
{{- if and $model.letters (not $model.search) -}}
|
||||
<div id="personalphabet" class="flex flex-col text-xl pt-8 relative">
|
||||
{{- range $id, $r := .letters -}}
|
||||
<a
|
||||
class="odd:bg-stone-100 even:bg-zinc-100 mb-1 border-zinc-300 border-y border-l [&>a[aria-current='page']]:font-bold
|
||||
px-2 no-underline transition-all duration-75
|
||||
{{ if not $model.letter -}}inactive{{- end -}}"
|
||||
:class="search ? 'inactive' : 'active'"
|
||||
href="?letter={{ $r }}{{- if $model.filter }}&filter={{ $model.filter }}{{- end -}}"
|
||||
{{ if eq $model.letter $r }}aria-current="page"{{ end }}
|
||||
hx-select="main"
|
||||
hx-target="main"
|
||||
hx-swap="outerHTML scroll:#pageheading:top"
|
||||
>{{ $r }}</a
|
||||
>
|
||||
{{- end -}}
|
||||
</div>
|
||||
{{- end -}}
|
||||
{{ template "alphabet" . }}
|
||||
|
||||
|
||||
<!-- INFO: 3. rechte Spalte -->
|
||||
<div class="w-full">
|
||||
<!-- INFO: 4. Header -->
|
||||
<div id="personheader" class="border-t border-r border-zinc-300 relative w-full">
|
||||
<h1
|
||||
class="text-3xl font-bold px-3 relative -translate-y-[55%] w-min whitespace-nowrap bg-stone-50 ml-24 z-20">
|
||||
<span x-show="!search">
|
||||
{{- if $isPerson -}}
|
||||
Personen
|
||||
{{- else if $isOrg -}}
|
||||
Verlage, Druckereien & Vertriebe
|
||||
{{- end -}}
|
||||
</span>
|
||||
<span x-show="search"> Suche · Alle Personen & Körperschaften </span>
|
||||
</h1>
|
||||
{{ template "heading" . }}
|
||||
|
||||
<div class="flex flex-row justify-between">
|
||||
<div class="w-[60%] shrink-0 grow-0">
|
||||
<div class="min-w-[22.5rem] max-w-96 flex flex-row relative mt-9 ml-auto">
|
||||
<div class="">
|
||||
<i class="ri-search-line"></i
|
||||
><i class="-ml-0.5 inline-block ri-arrow-right-s-line"></i>
|
||||
</div>
|
||||
<div class="pb-0 border-b-4 border-zinc-300 grow">
|
||||
<input
|
||||
class="px-1.5 font-serif placeholder:italic w-full"
|
||||
type="search"
|
||||
name="search"
|
||||
value="{{ $model.search }}"
|
||||
placeholder="Suchbegriff"
|
||||
x-model="search"
|
||||
hx-get=""
|
||||
hx-trigger="input changed delay=500ms, keyup[key=='Enter']"
|
||||
hx-sync="this:replace"
|
||||
hx-select="#searchresults"
|
||||
hx-target="#searchresults"
|
||||
autocomplete="off"
|
||||
{{ if $model.active }}autofocus="true"{{ end }}
|
||||
{{ if $model.search }}disabled="true"{{ end }} />
|
||||
</div>
|
||||
<div id="permalink" class="font-serif ml-3 min-w-7 pb-1">
|
||||
<tool-tip position="right" x-show="search">
|
||||
<a
|
||||
:href="'/personen/?search=' + search"
|
||||
x-show="search"
|
||||
class="inline-block px-1
|
||||
text-white no-underline bg-stone-700 hover:bg-stone-900 rounded"
|
||||
hx-boost="false">
|
||||
<i class="ri-links-line"></i
|
||||
></a>
|
||||
<div class="data-tip">Link zu dieser Suchanfrage</div>
|
||||
</tool-tip>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{- if $isPerson -}}
|
||||
<div x-show="!search" class="flex flex-row gap-x-3 font-serif mr-6 items-end">
|
||||
<label
|
||||
for="filter"
|
||||
class="align-bottom h-min self-end pb-1 text-sm font-sans text-stone-700"
|
||||
>Anzeige:</label
|
||||
>
|
||||
<select
|
||||
class="h-min pb-1 border-b-4 border-zinc-300 px-1.5"
|
||||
name="filter"
|
||||
id="filter"
|
||||
hx-get="/personen{{- if .letter -}}?letter={{ .letter }}{{- end -}}"
|
||||
trigger="change"
|
||||
hx-push-url="true"
|
||||
hx-select="main"
|
||||
hx-target="main">
|
||||
<option value="noorg" {{ if $isNoOrg }}selected{{ end }}>Alle Personen</option>
|
||||
<option value="musik" {{ if $isMusik }}selected{{ end }}>Musiker:innen</option>
|
||||
<option value="autor" {{ if $isAutor }}selected{{ end }}>Autor:innen</option>
|
||||
<option value="graphik" {{ if $isGraphik }}selected{{ end }}>
|
||||
Graphiker:innen
|
||||
</option>
|
||||
<option value="hrsg" {{ if $isHrsg }}selected{{ end }}>Herausgeber:innen</option>
|
||||
</select>
|
||||
</div>
|
||||
{{- end -}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mt-4 ml-4 font-serif font-lg" id="searchresults">
|
||||
{{ if or .agents .altagents }}
|
||||
{{ if .agents }}
|
||||
<table class="w-full [&_td]:!align-top">
|
||||
{{ range $count, $agent := .agents }}
|
||||
<tr>
|
||||
<td>
|
||||
<a href="/person/{{ $agent.Id }}" class="font-bold">
|
||||
{{ $agent.Name }}
|
||||
{{ if $agent.Pseudonyms }}
|
||||
<br />
|
||||
({{ $agent.Pseudonyms }})
|
||||
{{ end }}
|
||||
</a>
|
||||
</td>
|
||||
<td>
|
||||
{{ if $agent.CorporateBody }}
|
||||
Körperschaft
|
||||
{{ else }}
|
||||
{{ $agent.Profession }},
|
||||
{{ $agent.BiographicalData }}
|
||||
{{ end }}
|
||||
</td>
|
||||
<td>{{ $agent.References }}</td>
|
||||
</tr>
|
||||
{{ end }}
|
||||
|
||||
</table>
|
||||
{{ end }}
|
||||
{{ if .altagents }}
|
||||
<table class="w-full mt-6">
|
||||
{{ range $count, $agent := .altagents }}
|
||||
<tr>
|
||||
<td>
|
||||
{{ $agent.Name }}
|
||||
{{ if $agent.Pseudonyms }}
|
||||
<br />
|
||||
({{ $agent.Pseudonyms }})
|
||||
{{ end }}
|
||||
</td>
|
||||
<td>
|
||||
{{ if $agent.CorporateBody }}
|
||||
Körperschaft
|
||||
{{ else }}
|
||||
{{ $agent.Profession }},
|
||||
{{ $agent.BiographicalData }}
|
||||
{{ end }}
|
||||
</td>
|
||||
<td>{{ $agent.References }}</td>
|
||||
</tr>
|
||||
{{ end }}
|
||||
</table>
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
<p>Keine Personen gefunden.</p>
|
||||
{{ end }}
|
||||
<div class="flex flex-row justify-end">
|
||||
{{ template "professionselectbox" . }}
|
||||
{{ template "searchbox" . }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- INFO: 4. Personenliste -->
|
||||
<div class="mt-7 ml-9 mr-5 font-serif font-lg" id="searchresults">
|
||||
{{ if or .agents .altagents }}
|
||||
{{ if .agents }}
|
||||
<div class="w-full flex flex-col">
|
||||
{{ range $count, $agent := .agents }}
|
||||
<div class="flex flex-row odd:bg-stone-100 even:bg-stone-50 px-3 py-0.5">
|
||||
<div class="grow">
|
||||
<a href="/person/{{ $agent.Id }}" class="search-result font-bold">
|
||||
{{ $agent.Name }}
|
||||
</a>
|
||||
<span class="inline-block font-sans text-sm">
|
||||
{{ if not $agent.CorporateBody }}
|
||||
{{ $agent.BiographicalData }}
|
||||
{{ end }}
|
||||
</span>
|
||||
|
||||
{{ if $agent.Pseudonyms }}
|
||||
<p class="italic indent-3">
|
||||
auch:
|
||||
<span class="search-result">
|
||||
{{ $agent.Pseudonyms }}
|
||||
</span>
|
||||
</p>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
<div class="w-48 text-right shrink-0">
|
||||
{{- if $agent.CorporateBody -}}
|
||||
<span class="text-sm font-sans text-gray-500">Körperschaft</span>
|
||||
{{ else }}
|
||||
{{- $parr := $agent.ProfessionArray -}}
|
||||
{{- if $parr -}}
|
||||
{{- range $i, $p := $parr -}}
|
||||
<div
|
||||
class="inline-block px-2 py-0.5 text-sm font-sans
|
||||
bg-slate-200 rounded ml-2">
|
||||
{{ $p }}
|
||||
</div>
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
</div>
|
||||
|
||||
<div class="w-64 ml-4 shrink-0">{{ $agent.References }}</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ if .altagents }}
|
||||
{{ end }}
|
||||
{{ else }}
|
||||
<p>Keine Personen gefunden.</p>
|
||||
{{ end }}
|
||||
|
||||
{{ if .search }}
|
||||
<script type="module">
|
||||
let elements = document.querySelectorAll('.search-result');
|
||||
let mark_instance = new Mark(elements);
|
||||
// INFO: we wait a little bit before marking, to settle everything
|
||||
setTimeout(() => {
|
||||
mark_instance.mark('{{ $model.search }}', {
|
||||
"seperateWordSearch": true,
|
||||
});
|
||||
}, 200);
|
||||
</script>
|
||||
{{ end }}
|
||||
<!-- INFO: Ende Personenliste -->
|
||||
</div>
|
||||
<!-- INFO: Ende rechte Spalte -->
|
||||
</div>
|
||||
<!-- INFO: Ende Spalten-Layout -->
|
||||
</div>
|
||||
<!-- INFO: Ende Container -->
|
||||
</div>
|
||||
|
||||
18
views/routes/personen/components/alphabet.gohtml
Normal file
18
views/routes/personen/components/alphabet.gohtml
Normal file
@@ -0,0 +1,18 @@
|
||||
{{ $model := . }}
|
||||
|
||||
{{- if and $model.letters (not $model.search) -}}
|
||||
<div id="personalphabet" class="flex flex-col text-xl pt-20 relative">
|
||||
{{- range $id, $r := .letters -}}
|
||||
<a
|
||||
class="{{ if not $model.letter -}}inactive{{- end -}}"
|
||||
:class="search ? 'inactive' : 'active'"
|
||||
href="?letter={{ $r }}{{- if $model.filter }}&filter={{ $model.filter }}{{- end -}}"
|
||||
{{ if eq $model.letter $r }}aria-current="page"{{ end }}
|
||||
hx-select="main"
|
||||
hx-target="main"
|
||||
hx-swap="outerHTML scroll:#pageheading:top"
|
||||
>{{ $r }}</a
|
||||
>
|
||||
{{- end -}}
|
||||
</div>
|
||||
{{- end -}}
|
||||
20
views/routes/personen/components/heading.gohtml
Normal file
20
views/routes/personen/components/heading.gohtml
Normal file
@@ -0,0 +1,20 @@
|
||||
{{ $model := . }}
|
||||
|
||||
{{ $isPerson := and $model.filter (or (eq $model.filter "noorg") (eq $model.filter "musik") (eq $model.filter "autor") (eq $model.filter "graphik") (eq $model.filter "hrsg")) }}
|
||||
|
||||
{{ $isNoOrg := and $model.filter (eq $model.filter "noorg") }}
|
||||
|
||||
{{ $isOrg := and $model.filter (eq $model.filter "org") }}
|
||||
|
||||
|
||||
<h1
|
||||
class="text-3xl font-bold px-3 relative -translate-y-[55%] w-min whitespace-nowrap bg-stone-50 ml-24 z-20">
|
||||
<span x-show="!search">
|
||||
{{- if $isPerson -}}
|
||||
Personen
|
||||
{{- else if $isOrg -}}
|
||||
Verlage, Druckereien & Vertriebe
|
||||
{{- end -}}
|
||||
</span>
|
||||
<span x-show="search"> Suche · Alle Personen & Körperschaften </span>
|
||||
</h1>
|
||||
25
views/routes/personen/components/menu.gohtml
Normal file
25
views/routes/personen/components/menu.gohtml
Normal file
@@ -0,0 +1,25 @@
|
||||
{{ $model := . }}
|
||||
|
||||
{{ $isPerson := and $model.filter (or (eq $model.filter "noorg") (eq $model.filter "musik") (eq $model.filter "autor") (eq $model.filter "graphik") (eq $model.filter "hrsg")) }}
|
||||
|
||||
{{ $isOrg := and $model.filter (eq $model.filter "org") }}
|
||||
|
||||
{{- if not $model.search -}}
|
||||
{{/* INFO: We always redrect to letter = A bc some letters dont exist for other types */}}
|
||||
<div
|
||||
id="persontype"
|
||||
class="flex flex-row justify-end align-right text-right mr-4 gap-x-3"
|
||||
:class="search ? 'inactive' : ''">
|
||||
<a
|
||||
href="/personen?letter=A"
|
||||
{{ if $isPerson -}}aria-current="page"{{- end -}}
|
||||
>Personen</a
|
||||
>
|
||||
|
||||
<a
|
||||
href="/personen?filter=org"
|
||||
{{ if $isOrg -}}aria-current="page"{{- end -}}
|
||||
>Verlage, Druckereien & Vertriebe</a
|
||||
>
|
||||
</div>
|
||||
{{- end -}}
|
||||
40
views/routes/personen/components/professionselectbox.gohtml
Normal file
40
views/routes/personen/components/professionselectbox.gohtml
Normal file
@@ -0,0 +1,40 @@
|
||||
{{ $model := . }}
|
||||
|
||||
{{ $isPerson := and $model.filter (or (eq $model.filter "noorg") (eq $model.filter "musik") (eq $model.filter "autor") (eq $model.filter "graphik") (eq $model.filter "hrsg")) }}
|
||||
|
||||
{{ $isNoOrg := and $model.filter (eq $model.filter "noorg") }}
|
||||
|
||||
{{ $isOrg := and $model.filter (eq $model.filter "org") }}
|
||||
|
||||
{{ $isMusik := and $model.filter (eq $model.filter "musik") }}
|
||||
|
||||
{{ $isAutor := and $model.filter (eq $model.filter "autor") }}
|
||||
|
||||
{{ $isGraphik := and $model.filter (eq $model.filter "graphik") }}
|
||||
|
||||
{{ $isHrsg := and $model.filter (eq $model.filter "hrsg") }}
|
||||
|
||||
{{- if $isPerson -}}
|
||||
<div x-show="!search" class="flex flex-row gap-x-3 font-serif mr-6 items-end">
|
||||
<label for="filter" class="align-bottom h-min self-end pb-1 text-sm font-sans text-stone-700"
|
||||
>Berufe</label
|
||||
>
|
||||
|
||||
{{/* INFO: We always redrect to letter = A bc some letters dont exist for other professions */}}
|
||||
<select
|
||||
class="h-min pb-1 border-b-4 border-zinc-300 px-1.5"
|
||||
name="filter"
|
||||
id="filter"
|
||||
hx-get="/personen?letter=A"
|
||||
trigger="change"
|
||||
hx-push-url="true"
|
||||
hx-select="main"
|
||||
hx-target="main">
|
||||
<option value="noorg" {{ if $isNoOrg }}selected{{ end }}>Alle</option>
|
||||
<option value="musik" {{ if $isMusik }}selected{{ end }}>Musiker:innen</option>
|
||||
<option value="autor" {{ if $isAutor }}selected{{ end }}>Autor:innen</option>
|
||||
<option value="graphik" {{ if $isGraphik }}selected{{ end }}>Graphiker:innen</option>
|
||||
<option value="hrsg" {{ if $isHrsg }}selected{{ end }}>Herausgeber:innen</option>
|
||||
</select>
|
||||
</div>
|
||||
{{- end -}}
|
||||
40
views/routes/personen/components/searchbox.gohtml
Normal file
40
views/routes/personen/components/searchbox.gohtml
Normal file
@@ -0,0 +1,40 @@
|
||||
{{ $model := . }}
|
||||
|
||||
|
||||
<div class="ml-12 shrink-0 grow-0 mr-2.5">
|
||||
<div class="min-w-[22.5rem] max-w-96 flex flex-row relative mt-9 ml-auto">
|
||||
<div class="">
|
||||
<i class="ri-search-line"></i><i class="-ml-0.5 inline-block ri-arrow-right-s-line"></i>
|
||||
</div>
|
||||
<div class="pb-0 border-b-4 border-zinc-300 grow">
|
||||
<input
|
||||
class="px-1.5 font-serif placeholder:italic w-full"
|
||||
type="search"
|
||||
name="search"
|
||||
value="{{ $model.search }}"
|
||||
placeholder="Suchbegriff"
|
||||
x-model="search"
|
||||
hx-get=""
|
||||
hx-trigger="input changed delay=500ms, keyup[key=='Enter']"
|
||||
hx-sync="this:replace"
|
||||
hx-select="#searchresults"
|
||||
hx-target="#searchresults"
|
||||
autocomplete="off"
|
||||
{{ if $model.active }}autofocus="true"{{ end }}
|
||||
{{ if $model.search }}disabled="true"{{ end }} />
|
||||
</div>
|
||||
<div id="permalink" class="font-serif ml-3 min-w-7 pb-1">
|
||||
<tool-tip position="right" x-show="search">
|
||||
<a
|
||||
:href="'/personen/?search=' + search"
|
||||
x-show="search"
|
||||
class="inline-block px-1
|
||||
text-white no-underline bg-stone-700 hover:bg-stone-900 rounded"
|
||||
hx-boost="false">
|
||||
<i class="ri-links-line"></i
|
||||
></a>
|
||||
<div class="data-tip">Link zu dieser Suchanfrage</div>
|
||||
</tool-tip>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1 @@
|
||||
<title>{{ .site.title }}: Personen</title>
|
||||
|
||||
@@ -1,187 +1,81 @@
|
||||
{{ $model := . }}
|
||||
|
||||
{{ if and .startpage .record }}
|
||||
<div
|
||||
class="bg-[url(/assets/hintergrund.png)] w-full border-t border-b py-8 mt-9 relative"
|
||||
x-data="{ open: true }"
|
||||
x-show="open">
|
||||
<div class="container-extraoversize flex flex-row gap-x-8">
|
||||
<div class="max-w-[52rem] font-serif text-lg hyphens-auto">
|
||||
{{ Safe .record.Text }}
|
||||
</div>
|
||||
<div class="-mr-16 pt-2 grow-0 shrink-0">
|
||||
<img src="{{ .record.ImagePath }}" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="absolute top-0 right-0 m-4 mr-8">
|
||||
<tool-tip position="left">
|
||||
<div class="data-tip">Hinweis schließen</div>
|
||||
<button
|
||||
@click="open = false"
|
||||
class="text-3xl text-stone-500 opacity-85 hover:opacity-100 transition-opacity
|
||||
duration-200 hover:text-stone-900 leading-none
|
||||
hover:cursor-pointer">
|
||||
<i class="ri-close-circle-fill"></i>
|
||||
</button>
|
||||
</tool-tip>
|
||||
</div>
|
||||
</div>
|
||||
{{ template "hero" . }}
|
||||
{{ end }}
|
||||
|
||||
|
||||
<!-- INFO: 1. Container -->
|
||||
<div x-data="{ search : '{{ $model.search }}' }" :class="search ? 'searchfilter' : ''">
|
||||
<!-- INFO: 2. Header -->
|
||||
<div id="pageheading" class="headingcontainer">
|
||||
<h1 class="heading">Bände nach Reihentiteln</h1>
|
||||
|
||||
<div class="flex flex-row justify-center ">
|
||||
{{ if .letter }}
|
||||
<div class="notifier" x-show="!search">
|
||||
<i class="ri-sort-alphabet-asc"></i>
|
||||
<span class="filtercategory">Alle Reihen</span> ·
|
||||
<span class="">Anfangsbuchstabe <span class="filterterm">{{ .letter }}</span></span>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
|
||||
<div class="notifier" x-show="search">
|
||||
<i class="ri-search-line"></i>
|
||||
<span class="filtercategory">Suche</span>
|
||||
· <span class="filterterm" x-text="search"></span>
|
||||
</div>
|
||||
|
||||
{{ if .search }}
|
||||
<div class="notifier" x-show="search">
|
||||
<i class="ri-links-line"></i>
|
||||
<span class="filtercategory">Link</span>
|
||||
· <span class="filterterm" x-text="window.location.href"></span>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if .a }}
|
||||
<div class="notifier" x-show="!search">
|
||||
{{ if .a.CorporateBody }}
|
||||
<i class="ri-team-line"></i>
|
||||
<span class="filtercategory">Verlag, Druckerei oder Vertrieb</span> ·
|
||||
{{ else }}
|
||||
<i class="ri-user-line"></i>
|
||||
<span class="filtercategory">Herausgeber:in</span> ·
|
||||
{{ end }}
|
||||
<span class="filterterm">{{ .a.Name }}</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if .p }}
|
||||
<div class="notifier" x-show="!search">
|
||||
<i class="ri-map-pin-line"></i>
|
||||
<span class="filtercategory">Erscheinungsort</span> ·
|
||||
<span class="filterterm">{{ .p.Name }}</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if .year }}
|
||||
<div class="notifier" x-show="!search">
|
||||
<i class="ri-calendar-line"></i>
|
||||
<span class="filtercategory">Geltungsjahr</span> ·
|
||||
<span class="filterterm">{{ .year }}</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if not .letter }}
|
||||
<div class="notifier ml-2" x-show="!search">
|
||||
<a href="/reihen" class="no-underline">
|
||||
<i class="ri-arrow-left-long-line"></i> Alle Reihen anzeigen
|
||||
</a>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
|
||||
<div class="notifier ml-2" x-show="search">
|
||||
<a href="/reihen" class="no-underline">
|
||||
<i class="ri-arrow-left-long-line"></i> Alle Reihen anzeigen
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{{ template "notifier" . }}
|
||||
|
||||
{{ if not .search }}
|
||||
<div class="mt-2">
|
||||
{{ template "_alphabet" Dict "active" .letter "letters" .letters "search" .search }}
|
||||
{{ template "alphabet" Dict "active" .letter "letters" .letters "search" .search }}
|
||||
</div>
|
||||
{{ else }}
|
||||
<div class="mt-2 border-b border-zinc-300 w-full"></div>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
<!-- INFO: 2. Breite Anzeige -->
|
||||
<div class="container-oversize mt-4">
|
||||
{{ if not .search }}
|
||||
<div class="">
|
||||
{{ template "_reihenfilter" . }}
|
||||
</div>
|
||||
{{ template "filter" . }}
|
||||
{{ end }}
|
||||
|
||||
|
||||
<!-- INFO: 3. Treffer -->
|
||||
<div id="searchcontent" class="font-serif">
|
||||
{{ if $model.search }}
|
||||
<script type="module">
|
||||
let elements = document.querySelectorAll('.reihen-text');
|
||||
let mark_instance = new Mark(elements);
|
||||
// INFO: we wait a little bit before marking, to settle everything
|
||||
setTimeout(() => {
|
||||
mark_instance.mark('{{ $model.search }}', {
|
||||
"seperateWordSearch": true,
|
||||
});
|
||||
}, 200);
|
||||
</script>
|
||||
{{ if and .search .idseries }}
|
||||
<div class="mb-1 max-w-[60rem] hyphens-auto">
|
||||
{{ range $id, $r := .idseries }}
|
||||
{{ template "_reihe" (Arr $r $model.entries $model.relations true false false) }}
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if .series }}
|
||||
<div class="mb-1 max-w-[60rem] hyphens-auto">
|
||||
{{ range $id, $r := .series }}
|
||||
{{ template "_reihe" (Arr $r $model.entries $model.relations false false
|
||||
false)
|
||||
}}
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
<div class="">
|
||||
{{ if and .search .idseries }}
|
||||
<div class="mb-1 max-w-[60rem] hyphens-auto">
|
||||
{{ range $id, $r := .idseries }}
|
||||
{{ template "_reihe" (Arr $r $model.entries $model.relations true false false) }}
|
||||
{{ end }}
|
||||
{{ if and .search .altseries }}
|
||||
{{ if .idseries }}
|
||||
<div class="border-b text-sm font-sans text-right pb-0.5">
|
||||
Treffer in Almanach-Nummer ↑
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if .series }}
|
||||
<div class="mb-1 max-w-[60rem] hyphens-auto">
|
||||
{{ range $id, $r := .series }}
|
||||
{{ template "_reihe" (Arr $r $model.entries $model.relations false false
|
||||
false)
|
||||
}}
|
||||
{{ end }}
|
||||
<div class="border-b text-sm font-sans text-right pb-0.5">
|
||||
Treffer in Reihentiteln ↑
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if and .search .altseries }}
|
||||
{{ if .idseries }}
|
||||
<div class="border-b text-sm font-sans text-right pb-0.5">
|
||||
Treffer in Almanach-Nummer ↑
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if .series }}
|
||||
<div class="border-b text-sm font-sans text-right pb-0.5">
|
||||
Treffer in Reihentiteln ↑
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if not (or .series .idseries) }}
|
||||
<div class="border-b text-sm font-sans text-right pb-0.5">
|
||||
Keine Treffer im Reihentitel
|
||||
<i class="ri-forbid-line inline-bloc -mr-0.5"></i>
|
||||
</div>
|
||||
{{ end }}
|
||||
<div class="border-t mb-1.5 text-sm font-sans text-right pt-0.5">
|
||||
Treffer in allen Feldern (inkl. Anmerkungen & Verweise) ↓
|
||||
</div>
|
||||
<div class="mb-1 max-w-[60rem] hyphens-auto">
|
||||
{{ range $id, $r := .altseries }}
|
||||
{{ template "_reihe" (Arr $r $model.entries $model.relations false true true) }}
|
||||
{{ end }}
|
||||
{{ if not (or .series .idseries) }}
|
||||
<div class="border-b text-sm font-sans text-right pb-0.5">
|
||||
Keine Treffer im Reihentitel
|
||||
<i class="ri-forbid-line inline-bloc -mr-0.5"></i>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
<div class="border-t mb-1.5 text-sm font-sans text-right pt-0.5">
|
||||
Treffer in allen Feldern (inkl. Anmerkungen & Verweise) ↓
|
||||
</div>
|
||||
<div class="mb-1 max-w-[60rem] hyphens-auto">
|
||||
{{ range $id, $r := .altseries }}
|
||||
{{ template "_reihe" (Arr $r $model.entries $model.relations false true true) }}
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ if not (or .series .altseries .idseries) }}
|
||||
<div class="mt-8">
|
||||
Keine Reihen
|
||||
@@ -189,6 +83,26 @@
|
||||
gefunden.
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if $model.search }}
|
||||
<script type="module">
|
||||
let elements = document.querySelectorAll('.reihen-text');
|
||||
let mark_instance = new Mark(elements);
|
||||
// INFO: we wait a little bit before marking, to settle everything
|
||||
setTimeout(() => {
|
||||
mark_instance.mark('{{ $model.search }}', {
|
||||
"seperateWordSearch": true,
|
||||
});
|
||||
}, 200);
|
||||
</script>
|
||||
{{ end }}
|
||||
|
||||
|
||||
<!-- INFO: Ende 3. Treffer -->
|
||||
</div>
|
||||
|
||||
<!-- INFO: Ende 2. Breite Anzeige -->
|
||||
</div>
|
||||
|
||||
<!-- INFO: Ende 1. Container -->
|
||||
</div>
|
||||
|
||||
26
views/routes/reihen/components/hero.gohtml
Normal file
26
views/routes/reihen/components/hero.gohtml
Normal file
@@ -0,0 +1,26 @@
|
||||
{{ $model := . }}
|
||||
<div
|
||||
class="bg-[url(/assets/hintergrund.png)] w-full border-t border-b py-8 mt-9 relative"
|
||||
x-data="{ open: true }"
|
||||
x-show="open">
|
||||
<div class="container-extraoversize flex flex-row gap-x-8">
|
||||
<div class="max-w-[52rem] font-serif text-lg hyphens-auto">
|
||||
{{ Safe $model.record.Text }}
|
||||
</div>
|
||||
<div class="-mr-16 pt-2 grow-0 shrink-0">
|
||||
<img src="{{ $model.record.ImagePath }}" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="absolute top-0 right-0 m-4 mr-8">
|
||||
<tool-tip position="left">
|
||||
<div class="data-tip">Hinweis schließen</div>
|
||||
<button
|
||||
@click="open = false"
|
||||
class="text-3xl text-stone-500 opacity-85 hover:opacity-100 transition-opacity
|
||||
duration-200 hover:text-stone-900 leading-none
|
||||
hover:cursor-pointer">
|
||||
<i class="ri-close-circle-fill"></i>
|
||||
</button>
|
||||
</tool-tip>
|
||||
</div>
|
||||
</div>
|
||||
71
views/routes/reihen/components/notifier.gohtml
Normal file
71
views/routes/reihen/components/notifier.gohtml
Normal file
@@ -0,0 +1,71 @@
|
||||
{{ $model := . }}
|
||||
|
||||
|
||||
<div class="flex flex-row justify-center ">
|
||||
{{ if .letter }}
|
||||
<div class="notifier" x-show="!search">
|
||||
<i class="ri-sort-alphabet-asc"></i>
|
||||
<span class="filtercategory">Alle Reihen</span> ·
|
||||
<span class="">Anfangsbuchstabe <span class="filterterm">{{ .letter }}</span></span>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
|
||||
<div class="notifier" x-show="search">
|
||||
<i class="ri-search-line"></i>
|
||||
<span class="filtercategory">Suche</span>
|
||||
· <span class="filterterm" x-text="search"></span>
|
||||
</div>
|
||||
|
||||
{{ if .search }}
|
||||
<div class="notifier" x-show="search">
|
||||
<i class="ri-links-line"></i>
|
||||
<span class="filtercategory">Link</span>
|
||||
· <span class="filterterm" x-text="window.location.href"></span>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if .a }}
|
||||
<div class="notifier" x-show="!search">
|
||||
{{ if .a.CorporateBody }}
|
||||
<i class="ri-team-line"></i>
|
||||
<span class="filtercategory">Verlag, Druckerei oder Vertrieb</span> ·
|
||||
{{ else }}
|
||||
<i class="ri-user-line"></i>
|
||||
<span class="filtercategory">Herausgeber:in</span> ·
|
||||
{{ end }}
|
||||
<span class="filterterm">{{ .a.Name }}</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if .p }}
|
||||
<div class="notifier" x-show="!search">
|
||||
<i class="ri-map-pin-line"></i>
|
||||
<span class="filtercategory">Erscheinungsort</span> ·
|
||||
<span class="filterterm">{{ .p.Name }}</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if .year }}
|
||||
<div class="notifier" x-show="!search">
|
||||
<i class="ri-calendar-line"></i>
|
||||
<span class="filtercategory">Geltungsjahr</span> ·
|
||||
<span class="filterterm">{{ .year }}</span>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
{{ if not .letter }}
|
||||
<div class="notifier ml-2" x-show="!search">
|
||||
<a href="/reihen" class="no-underline">
|
||||
<i class="ri-arrow-left-long-line"></i> Alle Reihen anzeigen
|
||||
</a>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
|
||||
<div class="notifier ml-2" x-show="search">
|
||||
<a href="/reihen" class="no-underline">
|
||||
<i class="ri-arrow-left-long-line"></i> Alle Reihen anzeigen
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user