mirror of
https://github.com/Theodor-Springmann-Stiftung/kgpz_web.git
synced 2025-10-30 01:25:30 +00:00
89 lines
3.5 KiB
Plaintext
89 lines
3.5 KiB
Plaintext
{{ $model := .model }}
|
|
|
|
{{ if $model.Images.HasImages }}
|
|
<!-- Container with proper padding -->
|
|
<div class="">
|
|
<!-- Three-column layout -->
|
|
<div class="flex flex-col lg:flex-row gap-6 w-full min-h-screen">
|
|
<!-- Column 1: Sticky Inhaltsverzeichnis -->
|
|
<div class="lg:w-1/4 xl:w-1/4 2xl:w-1/4 3xl:w-1/5 flex-shrink-0 bg-slate-50 px-4 py-4">
|
|
<div class="sticky top-4 max-h-screen overflow-y-auto overscroll-contain bg-slate-50">
|
|
<div class="mb-4">
|
|
{{ template "_title_nav" . }}
|
|
</div>
|
|
<div class="">
|
|
{{ template "_inhaltsverzeichnis" . }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Column 2: Newspaper pages -->
|
|
<div class="flex-1 py-4 pr-8 3xl:pr-0">
|
|
{{ template "_newspaper_layout" . }}
|
|
</div>
|
|
|
|
<!-- Column 3: Navigation buttons -->
|
|
<div class="w-16 lg:w-20 hidden 3xl:block xl:w-24 flex-shrink-0 ">
|
|
<div class="lg:sticky lg:top-12 lg:max-h-[calc(100vh-2rem)]">
|
|
<div class="space-y-3 flex flex-col items-center px-2 pt-8">
|
|
<button
|
|
id="prevPageBtn"
|
|
onclick="scrollToPreviousPage()"
|
|
class="w-14 h-10 lg:w-16 lg:h-12 px-2 py-1 bg-gray-200 hover:bg-gray-300 text-gray-700 hover:text-gray-800 border border-gray-300 transition-colors duration-200 flex items-center justify-center cursor-pointer"
|
|
title="Vorherige Seite"
|
|
style="display: none;">
|
|
<i class="ri-arrow-up-line text-lg lg:text-xl"></i>
|
|
</button>
|
|
|
|
<button
|
|
id="nextPageBtn"
|
|
onclick="scrollToNextPage()"
|
|
class="w-14 h-10 lg:w-16 lg:h-12 px-2 py-1 bg-gray-200 hover:bg-gray-300 text-gray-700 hover:text-gray-800 border border-gray-300 transition-colors duration-200 flex items-center justify-center cursor-pointer"
|
|
title="Nächste Seite">
|
|
<i class="ri-arrow-down-line text-lg lg:text-xl"></i>
|
|
</button>
|
|
|
|
{{ if $model.HasBeilageButton }}
|
|
<a
|
|
href="#beilage"
|
|
class="w-14 h-10 lg:w-16 lg:h-12 px-2 py-1 bg-amber-100 hover:bg-amber-200 text-amber-700 hover:text-amber-800 border border-amber-300 transition-colors duration-200 flex items-center justify-center cursor-pointer no-underline"
|
|
title="Zu Beilage">
|
|
<i class="ri-attachment-line text-lg lg:text-xl"></i>
|
|
</a>
|
|
{{ end }}
|
|
|
|
|
|
<!-- Separator for utility buttons -->
|
|
<!-- <div class="w-full border-t border-gray-200 my-4"></div> -->
|
|
|
|
<!-- Share Link Button -->
|
|
<!-- <button -->
|
|
<!-- id="shareLinkBtn" -->
|
|
<!-- onclick="shareCurrentPage()" -->
|
|
<!-- class="w-14 h-10 lg:w-16 lg:h-12 px-2 py-1 bg-blue-100 hover:bg-blue-200 text-blue-700 hover:text-blue-800 border border-blue-300 transition-colors duration-200 flex items-center justify-center cursor-pointer" -->
|
|
<!-- title="Link zur aktuellen Seite teilen"> -->
|
|
<!-- <i class="ri-share-line text-lg lg:text-xl"></i> -->
|
|
<!-- </button> -->
|
|
|
|
<!-- Citation Button -->
|
|
<!-- <button -->
|
|
<!-- id="citationBtn" -->
|
|
<!-- onclick="generateCitation()" -->
|
|
<!-- class="w-14 h-10 lg:w-16 lg:h-12 px-2 py-1 bg-green-100 hover:bg-green-200 text-green-700 hover:text-green-800 border border-green-300 transition-colors duration-200 flex items-center justify-center cursor-pointer" -->
|
|
<!-- title="Zitation für diese Seite generieren"> -->
|
|
<!-- <i class="ri-file-text-line text-lg lg:text-xl"></i> -->
|
|
<!-- </button> -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{ else }}
|
|
<div class="px-4 lg:px-6 xl:px-8">
|
|
<div class="max-w-4xl">
|
|
{{ template "_title_nav" . }}
|
|
{{ template "_inhaltsverzeichnis" . }}
|
|
</div>
|
|
</div>
|
|
{{ end }}
|