mirror of
https://github.com/Theodor-Springmann-Stiftung/kgpz_web.git
synced 2025-12-16 03:55:30 +00:00
Scrollspy
This commit is contained in:
@@ -59,34 +59,6 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Two Column Layout: Scrollspy + Content -->
|
||||
<div class="flex gap-8">
|
||||
<!-- Scrollspy Navigation - Hidden on smaller screens, shown on 2xl+ -->
|
||||
<div class="hidden 2xl:block w-96 flex-shrink-0">
|
||||
<div class="sticky top-0 max-h-screen bg-white rounded py-4 h-full flex flex-col border-x-6 border-white">
|
||||
<nav class="flex-1 overflow-y-auto overscroll-contain" id="scrollspy-nav">
|
||||
{{ range $_, $id := .model.Sorted }}
|
||||
{{ $a := index $.model.Agents $id }}
|
||||
<a href="#author-{{ $id }}"
|
||||
class="block px-2 py-0.5 text-lg text-gray-900 hover:bg-red-50 scrollspy-link
|
||||
transition-colors no-underline box-content"
|
||||
data-target="author-{{ $id }}">
|
||||
{{ index $a.Names 0 }}
|
||||
</a>
|
||||
{{ end }}
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- People List - Main Content -->
|
||||
<div class="flex-1 space-y-6 bg-white">
|
||||
{{ range $_, $id := .model.Sorted }}
|
||||
{{ $a := index $.model.Agents $id }}
|
||||
<div id="author-{{ $id }}" class="p-6 scroll-mt-8 author-section">
|
||||
{{ template "_akteur" $a }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
{{ template "_scrollspy_layout" .model }}
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
@@ -18,37 +18,5 @@
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Two Column Layout: Scrollspy + Content -->
|
||||
<div class="flex gap-8">
|
||||
<!-- Scrollspy Navigation - Hidden on smaller screens, shown on 2xl+ -->
|
||||
<div class="hidden 2xl:block w-80 flex-shrink-0">
|
||||
<div class="sticky top-8 h-screen">
|
||||
<div class="bg-white border border-gray-200 rounded-lg p-4 h-full flex flex-col">
|
||||
<h3 class="text-lg font-bold text-gray-900 mb-4">Auf dieser Seite</h3>
|
||||
<nav class="flex-1 overflow-y-auto" id="scrollspy-nav">
|
||||
{{ range $_, $id := .model.Sorted }}
|
||||
{{ $a := index $.model.Agents $id }}
|
||||
<a href="#author-{{ $id }}"
|
||||
class="block px-3 py-1 text-base text-gray-600 hover:text-blue-600 hover:bg-blue-50 rounded scrollspy-link transition-colors border-l-4 border-transparent"
|
||||
data-target="author-{{ $id }}">
|
||||
{{ index $a.Names 0 }}
|
||||
</a>
|
||||
{{ end }}
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Authors List - Main Content -->
|
||||
<div class="flex-1 space-y-6">
|
||||
{{ range $_, $id := .model.Sorted }}
|
||||
{{ $a := index $.model.Agents $id }}
|
||||
<div id="author-{{ $id }}" class="bg-stone-100 rounded-lg p-6 border border-stone-200 scroll-mt-8 author-section">
|
||||
{{ template "_akteur_header" $a }}
|
||||
{{ template "_akteur_beitraege" $a }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ template "_scrollspy_layout" .model }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{{ $a := . }}
|
||||
{{ $pieces := LookupPieces $a }}
|
||||
{{ if ne (len $pieces) 0 }}
|
||||
<div class="mt-4">
|
||||
<div class="mt-4 akteur-beitraege-section">
|
||||
<div class="py-1 rounded-lg mb-1">
|
||||
<h2 class="text-lg font-bold">
|
||||
<i class="ri-newspaper-line mr-2"></i><u class="decoration underline-offset-3">Beiträge</u>
|
||||
@@ -39,12 +39,10 @@
|
||||
<div class="columns-2 gap-6">
|
||||
{{- /* Display grouped pieces */ -}}
|
||||
{{- range $groupKey, $groupedItems := $groupedPieces -}}
|
||||
<div class="break-inside-avoid">
|
||||
<div class="break-inside-avoid pl-4">
|
||||
<div class="text-lg pb-1">
|
||||
{{- /* Use first piece for display text */ -}}
|
||||
<span class="inline-block indent-6">
|
||||
{{ template "_piece_summary" (dict "Piece" (index $groupedItems 0).Item "CurrentActorID" $a.ID) }}
|
||||
</span>
|
||||
|
||||
{{- /* Show all citations from all pieces in this group */ -}}
|
||||
{{- range $_, $groupItem := $groupedItems -}}
|
||||
@@ -70,7 +68,7 @@
|
||||
</div>
|
||||
</div>
|
||||
{{- end -}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{{ $a := . }}
|
||||
{{ $works := LookupWorks $a }}
|
||||
{{- if ne (len $works) 0 -}}
|
||||
<div class="mt-4">
|
||||
<div class="mt-4 akteur-werke-section">
|
||||
<div class="py-1 rounded-lg mb-1">
|
||||
<h2 class="text-lg font-bold">
|
||||
<i class="ri-book-line mr-2"></i><u class="decoration underline-offset-3">Werke</u>
|
||||
|
||||
32
views/routes/components/_scrollspy_layout.gohtml
Normal file
32
views/routes/components/_scrollspy_layout.gohtml
Normal file
@@ -0,0 +1,32 @@
|
||||
{{- /* Shared two-column layout with scrollspy navigation for agent pages */ -}}
|
||||
{{- $agents := .Agents -}}
|
||||
{{- $sorted := .Sorted -}}
|
||||
|
||||
<!-- Two Column Layout: Scrollspy + Content -->
|
||||
<div class="flex gap-8">
|
||||
<!-- Scrollspy Navigation - Hidden on smaller screens, shown on 2xl+ -->
|
||||
<div class="hidden 2xl:block w-96 flex-shrink-0">
|
||||
<div class="sticky top-0 max-h-screen bg-white rounded py-4 flex flex-col border-x-6 border-white">
|
||||
<nav class="flex-1 overflow-y-auto overscroll-contain" id="scrollspy-nav">
|
||||
{{ range $_, $id := $sorted }}
|
||||
{{ $a := index $agents $id }}
|
||||
<a href="#author-{{ $id }}"
|
||||
class="block px-2 py-0.5 text-lg text-gray-900 scrollspy-link no-underline box-content"
|
||||
data-target="author-{{ $id }}">
|
||||
{{ index $a.Names 0 }}
|
||||
</a>
|
||||
{{ end }}
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- People List - Main Content -->
|
||||
<div class="flex-1 space-y-6 bg-white">
|
||||
{{ range $_, $id := $sorted }}
|
||||
{{ $a := index $agents $id }}
|
||||
<div id="author-{{ $id }}" class="p-6 scroll-mt-8 author-section">
|
||||
{{ template "_akteur" $a }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user