A little bit of styling on the search page

This commit is contained in:
Simon Martens
2025-03-02 17:13:32 +01:00
parent 038598a79a
commit 0ba3be1516
7 changed files with 60 additions and 57 deletions

File diff suppressed because one or more lines are too long

View File

@@ -68,7 +68,9 @@
<div id="searchcontrol" class="container-normal">
{{- template "_heading" $model.parameters -}}
<div id="searchform" class="border-l border-zinc-300 px-8 py-10 relative">
{{- template "_musenalmidbox" Arr $model.parameters.AlmString "baende" -}}
{{- if not $model.parameters.Extended -}}
{{- template "_musenalmidbox" Arr $model.parameters.AlmString "beitraege" -}}
{{- end -}}
<form
id="simplesearchform"
class="w-full font-serif"

View File

@@ -69,7 +69,9 @@
<div id="searchcontrol" class="container-normal">
{{- template "_heading" $model.parameters -}}
<div id="searchform" class="border-l border-zinc-300 px-8 py-10 relative">
{{- template "_musenalmidbox" Arr $model.parameters.AlmString "beitraege" -}}
{{- if not $model.parameters.Extended -}}
{{- template "_musenalmidbox" Arr $model.parameters.AlmString "beitraege" -}}
{{- end -}}
<form
id="simplesearchform"
class="w-full font-serif"

View File

@@ -2,7 +2,7 @@
<div id="searchheading" class="flex flex-row justify-between min-h-14 items-end relative">
<nav id="searchnav" class="flex flex-row items-end">
<div
class="align-bottom text-lg h-min self-end pb-0.5 italic font-bold
class="align-bottom text-xl h-min self-end pb-0.5 italic font-bold
text-zinc-800">
Suche nach:
</div>
@@ -16,13 +16,13 @@
-->
<a
href="/suche/baende"
class="block no-underline"
class="block no-underline text-xl"
{{ if eq $model.Collection "baende" }}aria-current="page"{{- end -}}
>Bänden</a
>
<a
href="/suche/beitraege"
class="block no-underline"
class="block no-underline text-xl"
{{ if eq $model.Collection "beitraege" }}aria-current="page"{{- end -}}
>Beiträgen</a
>

View File

@@ -1,21 +1,23 @@
{{ $p := index . 0 }}
{{ $t := index . 1 }}
<form
id="lookupform"
class="w-full font-serif grid grid-cols-12 gap-x-4 mb-4"
method="get"
action="/suche/{{- $t -}}"
autocomplete="off">
<label for="almstring" class="col-span-3 align-middle hidden">Almanach-Nummer:</label>
<input
autocomplete="off"
minlength="1"
required="true"
type="search"
name="almstring"
id="almstring"
value="{{ $p }}"
placeholder="Alm-Nummer"
class="w-full col-span-3 placeholder:italic" />
<button id="submitbutton" type="submit" class="col-span-2">Nachschlagen</button>
</form>
<div class="flex flex-row gap-x-3 max-w-[48rem]">
<form
id="lookupform"
class="w-full font-serif grid grid-cols-12 gap-x-4 mb-4"
method="get"
action="/suche/{{- $t -}}"
autocomplete="off">
<label for="almstring" class="col-span-3 align-middle hidden">Almanach-Nummer:</label>
<input
autocomplete="off"
minlength="1"
required="true"
type="search"
name="almstring"
id="almstring"
value="{{ $p }}"
placeholder="Alm-Nummer"
class="w-full col-span-3 placeholder:italic placeholder:font-sans" />
<button id="submitbutton" type="submit" class="col-span-2">Nachschlagen</button>
</form>
</div>

View File

@@ -3,22 +3,28 @@
{{ $q := index . 2 }}
<label for="q" class="hidden">Suchbegriffe</label>
<input
{{ if $q }}value="{{ $q }}"{{- end }}
type="search"
name="q"
minlength="3"
required
placeholder="Suchbegriff (min. 3 Zeichen)"
class="w-full col-span-8
placeholder:italic" />
<button id="submitbutton" type="submit" class="col-span-2">Suchen</button>
<div class="w-full flex flex-row gap-x-3 mb-3 justify-between" id="simplesearchbox">
<div class="flex flex-row justify-between gap-x-3 w-full">
<label for="q" class="hidden">Suchbegriffe</label>
<input
{{ if $q }}value="{{ $q }}"{{- end }}
type="search"
name="q"
minlength="3"
required
placeholder="Suchbegriff (min. 3 Zeichen)"
class="w-full grow
placeholder:italic font-serif placeholder:font-sans" />
<button id="submitbutton" type="submit" class="min-w-36" form="simplesearchform">Suchen</button>
</div>
{{ if $extendable }}
<a
href="/suche/{{ $parameters.Collection }}?extended=true"
class="whitespace-nowrap self-end block col-span-2">
<i class="ri-arrow-right-long-line"></i> Erweiterte Suche
</a>
{{ end }}
{{ if $extendable }}
<a
href="/suche/{{ $parameters.Collection }}?extended=true"
class="whitespace-nowrap self-end block ">
<i class="ri-arrow-right-long-line"></i> Erweiterte Suche
</a>
{{ end }}
</div>
<script></script>

View File

@@ -277,20 +277,20 @@
@apply bg-zinc-300 w-[30%] absolute bottom-0 right-[70%] h-[1px] z-10;
}
#searchform input {
#searchform input:not(#serachform #simplesearchbox input) {
@apply w-full mx-auto px-2 py-1 border-zinc-600 border;
}
#searchform button {
@apply bg-stone-100 text-base px-2.5 py-1 rounded font-sans transition-all duration-75;
@apply bg-stone-900 text-gray-200 text-base min-w-36 rounded font-sans transition-all duration-75;
}
#searchform button:hover:not(:disabled) {
@apply cursor-pointer bg-stone-200;
@apply cursor-pointer bg-slate-800 text-white;
}
#searchform button:disabled {
@apply bg-stone-300 text-gray-500 cursor-not-allowed;
@apply bg-stone-400 text-white cursor-not-allowed;
}
#searchform .selectgroup {
@@ -310,7 +310,6 @@
}
#searchform .searchformcolumn {
@apply grid grid-cols-12 gap-y-3 w-full gap-x-4;
}
#searchfilter .filter-list-list {
@@ -445,15 +444,7 @@
}
#extendedsearchcolumn button {
@apply bg-stone-100 text-base px-2.5 py-1 rounded font-sans transition-all duration-75 col-start-4 col-span-4;
}
#extendedsearchcolumn button:hover:not(:disabled) {
@apply cursor-pointer bg-stone-200;
}
#extendedsearchcolumn button:disabled {
@apply bg-stone-300 text-gray-500 cursor-not-allowed;
@apply col-start-4 col-span-4 py-2;
}
#extendedsearchcolumn label {