some enhancements

templating/engine.go

@@ -1,6 +1,7 @@
 package templating
 
 import (
+	"fmt"
 	"html/template"
 	"io"
 	"io/fs"
@@ -82,6 +83,22 @@ func (e *Engine) funcs() error {
 		return result
 	})
 
+	// Template helpers
+	e.AddFunc("dict", func(values ...interface{}) (map[string]interface{}, error) {
+		if len(values)%2 != 0 {
+			return nil, fmt.Errorf("dict requires an even number of arguments")
+		}
+		dict := make(map[string]interface{})
+		for i := 0; i < len(values); i += 2 {
+			key, ok := values[i].(string)
+			if !ok {
+				return nil, fmt.Errorf("dict keys must be strings")
+			}
+			dict[key] = values[i+1]
+		}
+		return dict, nil
+	})
+
 	// Strings
 	e.AddFunc("FirstLetter", functions.FirstLetter)
 	e.AddFunc("Upper", strings.ToUpper)

viewmodels/issue_view.go

@@ -6,6 +6,7 @@ import (
 	"os"
 	"path/filepath"
 	"slices"
+	"sort"
 	"strconv"
 	"strings"
 
@@ -127,15 +128,15 @@ func NewSingleIssueView(y, no int, lib *xmlmodels.Library) (*IssueVM, error) {
 	slices.Sort(ppi.Pages)
 	slices.Sort(ppa.Pages)
 
-	// Group consecutive continuation pieces
-	sivm.Pieces = CreateIndividualPagesWithMetadata(ppi, lib)
-	sivm.AdditionalPieces = CreateIndividualPagesWithMetadata(ppa, lib)
-
 	images, err := LoadIssueImages(*issue)
 	if err != nil {
 		return nil, err
 	}
 	sivm.Images = images
+
+	// Group consecutive continuation pieces, including empty pages from images
+	sivm.Pieces = CreateIndividualPagesWithMetadata(ppi, lib)
+	sivm.AdditionalPieces = CreateIndividualPagesWithMetadataIncludingEmpty(ppa, lib, images.AdditionalPages)
 	sivm.HasBeilageButton = len(sivm.AdditionalPieces.Pages) > 0
 
 	return &sivm, nil
@@ -218,6 +219,54 @@ func pagesHaveIdenticalContent(items1, items2 []PieceByIssue) bool {
 	return true
 }
 
+// sortPiecesOnPage sorts pieces on a given page according to the ordering rules:
+// 1. Continuation pieces come first
+// 2. Within the same category (continuation/new), pieces are sorted by Order field if > 0
+// 3. If no Order field or Order = 0, maintain current order
+func sortPiecesOnPage(pieces []PieceByIssue, pageNumber int) []PieceByIssue {
+	if len(pieces) <= 1 {
+		return pieces
+	}
+
+	// Create a copy to avoid modifying the original slice
+	sorted := make([]PieceByIssue, len(pieces))
+	copy(sorted, pieces)
+
+	sort.Slice(sorted, func(i, j int) bool {
+		pieceA := sorted[i]
+		pieceB := sorted[j]
+
+		// Rule 1: Continuation pieces come before new pieces
+		if pieceA.IsContinuation != pieceB.IsContinuation {
+			return pieceA.IsContinuation // true comes before false
+		}
+
+		// Rule 2: Within same category, use Order field if both have valid orders
+		orderA := pieceA.Reference.Order
+		orderB := pieceB.Reference.Order
+
+		// Both have valid orders (> 0)
+		if orderA > 0 && orderB > 0 {
+			return orderA < orderB
+		}
+
+		// Only A has valid order
+		if orderA > 0 && orderB <= 0 {
+			return true
+		}
+
+		// Only B has valid order
+		if orderA <= 0 && orderB > 0 {
+			return false
+		}
+
+		// Rule 3: Neither has valid order, maintain original order
+		// This is automatically handled by the stable sort
+		return false
+	})
+
+	return sorted
+}
 
 // CreateIndividualPagesWithMetadata creates individual page entries with metadata
 func CreateIndividualPagesWithMetadata(pieces PiecesByPage, lib *xmlmodels.Library) IndividualPiecesByPage {
@@ -233,30 +282,20 @@ func CreateIndividualPagesWithMetadata(pieces PiecesByPage, lib *xmlmodels.Libra
 	// Process each page individually
 	for _, page := range pieces.Pages {
 		pageItems := pieces.Items[page]
+
+		// Sort pieces according to the ordering rules
+		sortedPageItems := sortPiecesOnPage(pageItems, page)
+
 		individualItems := []IndividualPieceByIssue{}
 
-		// First add all continuation pieces
+		// Convert sorted pieces to individual pieces
-		for _, piece := range pageItems {
+		for _, piece := range sortedPageItems {
-			if piece.IsContinuation {
+			individualPiece := IndividualPieceByIssue{
-				individualPiece := IndividualPieceByIssue{
+				PieceByIssue: piece,
-					PieceByIssue: piece,
+				IssueRefs:    getPieceIssueRefs(piece.Piece, lib),
-					IssueRefs:    getPieceIssueRefs(piece.Piece, lib),
+				PageIcon:     determinePageIcon(page, pieces.Pages),
-					PageIcon:     determinePageIcon(page, pieces.Pages),
-				}
-				individualItems = append(individualItems, individualPiece)
-			}
-		}
-
-		// Then add all non-continuation pieces
-		for _, piece := range pageItems {
-			if !piece.IsContinuation {
-				individualPiece := IndividualPieceByIssue{
-					PieceByIssue: piece,
-					IssueRefs:    getPieceIssueRefs(piece.Piece, lib),
-					PageIcon:     determinePageIcon(page, pieces.Pages),
-				}
-				individualItems = append(individualItems, individualPiece)
 			}
+			individualItems = append(individualItems, individualPiece)
 		}
 
 		if len(individualItems) > 0 {
@@ -269,6 +308,67 @@ func CreateIndividualPagesWithMetadata(pieces PiecesByPage, lib *xmlmodels.Libra
 	return individual
 }
 
+// CreateIndividualPagesWithMetadataIncludingEmpty creates individual page entries with metadata, including empty pages that have images
+func CreateIndividualPagesWithMetadataIncludingEmpty(pieces PiecesByPage, lib *xmlmodels.Library, imagePages map[int][]IssuePage) IndividualPiecesByPage {
+	individual := IndividualPiecesByPage{
+		Items: make(map[int][]IndividualPieceByIssue),
+		Pages: []int{},
+	}
+
+	// Collect all page numbers that should be included (from pieces and from images)
+	allPageNumbers := make(map[int]bool)
+
+	// Add pages with content
+	for _, page := range pieces.Pages {
+		allPageNumbers[page] = true
+	}
+
+	// Add pages with images (even if they have no content)
+	for _, pages := range imagePages {
+		for _, page := range pages {
+			if page.Available {
+				allPageNumbers[page.PageNumber] = true
+			}
+		}
+	}
+
+	// Create sorted list of all page numbers for icon determination
+	allPagesList := make([]int, 0, len(allPageNumbers))
+	for pageNum := range allPageNumbers {
+		allPagesList = append(allPagesList, pageNum)
+	}
+	slices.Sort(allPagesList)
+
+	// Process each page
+	for pageNum := range allPageNumbers {
+		pageItems := pieces.Items[pageNum]
+
+		if len(pageItems) > 0 {
+			// Page has content - process normally
+			sortedPageItems := sortPiecesOnPage(pageItems, pageNum)
+			individualItems := []IndividualPieceByIssue{}
+
+			for _, piece := range sortedPageItems {
+				individualPiece := IndividualPieceByIssue{
+					PieceByIssue: piece,
+					IssueRefs:    getPieceIssueRefs(piece.Piece, lib),
+					PageIcon:     determinePageIcon(pageNum, allPagesList),
+				}
+				individualItems = append(individualItems, individualPiece)
+			}
+
+			individual.Items[pageNum] = individualItems
+		} else {
+			// Page is empty but has images - create empty entry
+			individual.Items[pageNum] = []IndividualPieceByIssue{}
+		}
+
+		individual.Pages = append(individual.Pages, pageNum)
+	}
+
+	slices.Sort(individual.Pages)
+	return individual
+}
 
 // determinePageIcon determines the icon type for a page based on newspaper layout positioning
 func determinePageIcon(pageNum int, allPages []int) string {

views/routes/ausgabe/components/_inhaltsverzeichnis.gohtml

@@ -10,8 +10,8 @@
 			</div>
 			{{ range $page := $model.Pieces.Pages }}
 				{{ $pageItems := (index $model.Pieces.Items $page) }}
-				{{ $firstItem := index $pageItems 0 }}
+				{{ $firstItem := "" }}
-
+				{{ if $pageItems }}{{ $firstItem = index $pageItems 0 }}{{ end }}
 
 				<!-- Individual page entry -->
 				<div
@@ -19,16 +19,16 @@
 					data-page-container="{{ $page }}">
 					<div class="flex items-center justify-between gap-2 mb-2">
 						<div class="flex items-center gap-2">
-							<span class="icon-container">{{ PageIcon $firstItem.PageIcon }}</span>
+							<span class="icon-container">{{ if $firstItem }}{{ PageIcon $firstItem.PageIcon }}{{ else }}{{ PageIcon "first" }}{{ end }}</span>
 							<a
 								href="#page-{{ $page }}"
-								class="page-number-inhalts font-bold text-slate-700 bg-blue-50 px-2 py-1 rounded text-sm transition-colors duration-200 hover:bg-blue-100 no-underline"
+								class="page-number-inhalts font-bold text-slate-700 bg-slate-100 px-2 py-1 rounded text-sm transition-colors duration-200 hover:bg-slate-200 no-underline"
 								data-page-number="{{ $page }}">
 								<span class="page-label">{{ $page }}</span>
 							</a>
 						</div>
 						<button
-							class="page-permalink-btn text-slate-400 hover:text-blue-600 text-xs p-1 rounded hover:bg-blue-50 transition-colors duration-200"
+							class="page-permalink-btn text-slate-400 hover:text-slate-700 text-xs p-1 rounded hover:bg-slate-100 transition-colors duration-200"
 							title="Link zu dieser Seite kopieren"
 							onclick="copyPagePermalink('{{ $page }}', this)"
 							data-page="{{ $page }}">
@@ -38,7 +38,8 @@
 
 					<!-- Content area -->
 					<div class="space-y-0">
-						{{ range $individualPiece := $pageItems }}
+						{{ if $pageItems }}
+							{{ range $individualPiece := $pageItems }}
 							<div
 								class="inhalts-entry py-1 px-0 bg-slate-50 rounded hover:bg-slate-100 transition-colors duration-200 {{ if $individualPiece.PieceByIssue.IsContinuation }}
 									continuation-entry
@@ -57,7 +58,7 @@
 								{{ if and (not $individualPiece.PieceByIssue.IsContinuation) (gt (len $individualPiece.IssueRefs) 1) }}
 									<div class="mt-1 pt-1 border-t border-slate-100">
 										<div class="flex items-center flex-wrap gap-1">
-											<i class="ri-links-line text-blue-500 text-sm mr-1"></i>
+											<i class="ri-links-line text-slate-600 text-sm mr-1"></i>
 											{{ range $issue := $individualPiece.IssueRefs }}
 												<a
 													href="/{{- $issue.When -}}/{{- $issue.Nr -}}{{- if $issue.Von -}}
@@ -67,7 +68,7 @@
 															#page-{{ $issue.Von }}
 														{{- end -}}
 													{{- end -}}"
-													class="inline-flex items-center gap-1 px-2 py-1 bg-blue-50 text-blue-700 rounded-md text-xs font-medium hover:bg-blue-100 transition-colors duration-150"
+													class="inline-flex items-center gap-1 px-2 py-1 bg-slate-100 text-slate-700 rounded-md text-xs font-medium hover:bg-slate-200 transition-colors duration-150"
 													{{- if and (eq $issue.Nr $model.Number.No) (eq $issue.When.Year
 														$model.Datum.When.Year)
 													-}}
@@ -83,6 +84,14 @@
 								{{ end }}
 							</div>
 						{{ end }}
+						{{ else }}
+							<!-- Empty page indicator -->
+							<div class="inhalts-entry py-1 px-0">
+								<div class="entry-description leading-snug mb-1">
+									<span class="italic text-slate-500">Leer</span>
+								</div>
+							</div>
+						{{ end }}
 					</div>
 				</div>
 			{{- end -}}
@@ -97,10 +106,17 @@
 				<i class="ri-attachment-line text-amber-600"></i>
 				<h3 class="text-base font-semibold text-slate-800">Beilage</h3>
 			</div>
-			{{ range $page := $model.AdditionalPieces.Pages }}
+			{{ range $pageIndex, $page := $model.AdditionalPieces.Pages }}
 				{{ $pageItems := (index $model.AdditionalPieces.Items $page) }}
-				{{ $firstItem := index $pageItems 0 }}
+				{{ $firstItem := "" }}
-
+				{{ if $pageItems }}{{ $firstItem = index $pageItems 0 }}{{ end }}
+				{{ $allPages := $model.AdditionalPieces.Pages }}
+				{{ $pageCount := len $allPages }}
+				{{ $iconType := "first" }}
+				{{ if eq $pageIndex 0 }}{{ $iconType = "first" }}
+				{{ else if eq $pageIndex (sub $pageCount 1) }}{{ $iconType = "last" }}
+				{{ else if eq (mod $pageIndex 2) 1 }}{{ $iconType = "even" }}
+				{{ else }}{{ $iconType = "odd" }}{{ end }}
 
 				<!-- Individual beilage page entry -->
 				<div
@@ -109,7 +125,7 @@
 					data-beilage="true">
 					<div class="flex items-center justify-between gap-2 mb-2">
 						<div class="flex items-center gap-2">
-							<span class="icon-container">{{ PageIcon $firstItem.PageIcon }}</span>
+							<span class="icon-container">{{ if $firstItem }}{{ PageIcon $firstItem.PageIcon }}{{ else }}{{ PageIcon $iconType }}{{ end }}</span>
 							<a
 								href="#beilage-1-page-{{ $page }}"
 								class="page-number-inhalts font-bold text-slate-700 bg-amber-50 px-2 py-1 rounded text-sm transition-colors duration-200 hover:bg-amber-100 no-underline"
@@ -129,7 +145,8 @@
 
 					<!-- Content area -->
 					<div class="space-y-0">
-						{{ range $individualPiece := $pageItems }}
+						{{ if $pageItems }}
+							{{ range $individualPiece := $pageItems }}
 							<div
 								class="inhalts-entry py-1 px-0 bg-slate-50 rounded hover:bg-slate-100 transition-colors duration-200 {{ if $individualPiece.PieceByIssue.IsContinuation }}
 									continuation-entry
@@ -148,7 +165,7 @@
 								{{ if and (not $individualPiece.PieceByIssue.IsContinuation) (gt (len $individualPiece.IssueRefs) 1) }}
 									<div class="mt-1 pt-1 border-t border-slate-100">
 										<div class="flex items-center flex-wrap gap-1">
-											<i class="ri-links-line text-blue-500 text-sm mr-1"></i>
+											<i class="ri-links-line text-slate-600 text-sm mr-1"></i>
 											{{ range $issue := $individualPiece.IssueRefs }}
 												<a
 													href="/{{- $issue.When -}}/{{- $issue.Nr -}}{{- if $issue.Von -}}
@@ -158,7 +175,7 @@
 															#page-{{ $issue.Von }}
 														{{- end -}}
 													{{- end -}}"
-													class="inline-flex items-center gap-1 px-2 py-1 bg-blue-50 text-blue-700 rounded-md text-xs font-medium hover:bg-blue-100 transition-colors duration-150"
+													class="inline-flex items-center gap-1 px-2 py-1 bg-slate-100 text-slate-700 rounded-md text-xs font-medium hover:bg-slate-200 transition-colors duration-150"
 													{{- if and (eq $issue.Nr $model.Number.No) (eq $issue.When.Year
 														$model.Datum.When.Year)
 													-}}
@@ -174,6 +191,14 @@
 								{{ end }}
 							</div>
 						{{ end }}
+						{{ else }}
+							<!-- Empty page indicator -->
+							<div class="inhalts-entry py-1 px-0">
+								<div class="entry-description leading-snug mb-1">
+									<span class="italic text-slate-500">Leer</span>
+								</div>
+							</div>
+						{{ end }}
 					</div>
 				</div>
 			{{- end -}}

views/routes/ausgabe/components/_inhaltsverzeichnis_eintrag.gohtml

@@ -150,14 +150,14 @@
 			{{- if (or (eq $agentref.Category "") (eq $agentref.Category "autor")) -}}
 				{{- $agent := GetAgent $agentref.Ref -}}
 				{{- if and $agent (gt (len $agent.Names) 0) -}}
-					{{ Safe $fortsPrefix }}<a href="/akteure/{{ $agentref.Ref }}" class="author-link"
+					{{ Safe $fortsPrefix }}<a href="/akteure/{{ $agentref.Ref }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600"
 						>{{ index $agent.Names 0 }}</a
 					>,
 					<span class="review-format"
 						>Rezension von:
 						{{ if $workAuthorName }}
 							{{- if $workAuthorID -}}
-								<a href="/akteure/{{ $workAuthorID }}" class="author-link">{{ $workAuthorName }}</a>
+								<a href="/akteure/{{ $workAuthorID }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600">{{ $workAuthorName }}</a>
 							{{- else -}}
 								{{ $workAuthorName }}
 							{{- end -}},
@@ -173,8 +173,8 @@
 							<em>{{ $title }}</em>
 						{{ else }}
 							[Werk unbekannt]
-						{{ end }}{{ if $place }}({{ $place }}){{ end }}</span
+						{{ end }}</span
-					>
+					>{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
 					{{- $authorFound = true -}}
 					{{- break -}}
 				{{- end -}}
@@ -185,7 +185,7 @@
 				>Rezension von:
 				{{ if $workAuthorName }}
 					{{- if $workAuthorID -}}
-						<a href="/akteure/{{ $workAuthorID }}" class="author-link">{{ $workAuthorName }}</a>
+						<a href="/akteure/{{ $workAuthorID }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600">{{ $workAuthorName }}</a>
 					{{- else -}}
 						{{ $workAuthorName }}
 					{{- end -}},
@@ -201,8 +201,8 @@
 					<em>{{ $title }}</em>
 				{{ else }}
 					[Werk unbekannt]
-				{{ end }}{{ if $place }}({{ $place }}){{ end }}</span
+				{{ end }}</span
-			>
+			>{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
 		{{- end -}}
 
 	{{- else if $hasWeltnachrichten -}}
@@ -214,11 +214,10 @@
 			Nachruf und Einreiseliste
 		{{- else -}}
 			Einreiseliste
-		{{- end -}}
+		{{- end -}}{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
-		{{ if $place }}für {{ $place }}{{ end }}
 
 	{{- else if $hasWechselkurse -}}
-		Wechselkurse{{ if $place }}in {{ $place }}{{ end }}
+		Wechselkurse{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
 
 	{{- else if $hasBuecher -}}
 		Bücheranzeigen{{ if $title }}: <em>{{ $title }}</em>{{ end }}
@@ -228,8 +227,7 @@
 			Todesanzeige
 		{{ else }}
 			Lokalanzeige
-		{{ end }}
+		{{ end }}{{ if $title }}: <em>{{ $title }}</em>{{ end }}{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
-		{{ if $place }}aus {{ $place }}{{ end }}{{ if $title }}: <em>{{ $title }}</em>{{ end }}
 
 	{{- else if $hasLokalnachrichten -}}
 		{{ if $hasLotterie }}
@@ -242,8 +240,7 @@
 			Festlichkeiten
 		{{ else }}
 			Lokalnachrichten
-		{{ end }}
+		{{ end }}{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
-		{{ if $place }}aus {{ $place }}{{ end }}
 
 	{{- else if $hasGedicht -}}
 		{{- $authorFound := false -}}
@@ -251,7 +248,7 @@
 			{{- if (or (eq $agentref.Category "") (eq $agentref.Category "autor")) -}}
 				{{- $agent := GetAgent $agentref.Ref -}}
 				{{- if and $agent (gt (len $agent.Names) 0) -}}
-					<a href="/akteure/{{ $agentref.Ref }}" class="author-link">{{ index $agent.Names 0 }}</a>,
+					<a href="/akteure/{{ $agentref.Ref }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600">{{ index $agent.Names 0 }}</a>,
 					{{ if $hasKommentar }}
 						Gedicht mit Kommentar
 					{{ else if $hasUebersetzung }}
@@ -279,8 +276,7 @@
 		{{- end -}}
 
 	{{- else if $hasVorladung -}}
-		Gerichtliche
+		Gerichtliche Vorladung{{ if $title }}: <em>{{ $title }}</em>{{ end }}{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
-		Vorladung{{ if $place }}in {{ $place }}{{ end }}{{ if $title }}: <em>{{ $title }}</em>{{ end }}
 
 	{{- else if $hasAufsatz -}}
 		{{- $authorFound := false -}}
@@ -288,7 +284,7 @@
 			{{- if (or (eq $agentref.Category "") (eq $agentref.Category "autor")) -}}
 				{{- $agent := GetAgent $agentref.Ref -}}
 				{{- if and $agent (gt (len $agent.Names) 0) -}}
-					{{ Safe $fortsPrefix }}<a href="/akteure/{{ $agentref.Ref }}" class="author-link"
+					{{ Safe $fortsPrefix }}<a href="/akteure/{{ $agentref.Ref }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600"
 						>{{ index $agent.Names 0 }}</a
 					>,
 					{{ if $hasReplik }}
@@ -332,8 +328,7 @@
 			Gelehrter Kommentar
 		{{ else }}
 			Gelehrte Nachrichten
-		{{ end }}
+		{{ end }}{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
-		{{ if $place }}aus {{ $place }}{{ end }}
 
 	{{- else if $hasTheaterkritik -}}
 		{{- $authorFound := false -}}
@@ -341,17 +336,17 @@
 			{{- if (or (eq $agentref.Category "") (eq $agentref.Category "autor")) -}}
 				{{- $agent := GetAgent $agentref.Ref -}}
 				{{- if and $agent (gt (len $agent.Names) 0) -}}
-					{{ Safe $fortsPrefix }}<a href="/akteure/{{ $agentref.Ref }}" class="author-link"
+					{{ Safe $fortsPrefix }}<a href="/akteure/{{ $agentref.Ref }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600"
 						>{{ index $agent.Names 0 }}</a
 					>,
 					Theaterkritik{{ if $workTitle }}
 						zu <em>{{ $workTitle }}</em>{{ if $workAuthorName }}
 							von
-							<a href="/akteure/{{ $workAuthorID }}" class="author-link">{{ $workAuthorName }}</a>
+							<a href="/akteure/{{ $workAuthorID }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600">{{ $workAuthorName }}</a>
 						{{ end }}
 					{{ else if $title }}
 						zu <em>{{ $title }}</em>
-					{{ end }}{{ if $place }}({{ $place }}){{ end }}
+					{{ end }}{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
 					{{- $authorFound = true -}}
 					{{- break -}}
 				{{- end -}}
@@ -360,11 +355,11 @@
 		{{- if not $authorFound -}}
 			{{ Safe $fortsPrefix }}Theaterkritik{{ if $workTitle }}
 				zu <em>{{ $workTitle }}</em>{{ if $workAuthorName }}
-					von <a href="/akteure/{{ $workAuthorID }}" class="author-link">{{ $workAuthorName }}</a>
+					von <a href="/akteure/{{ $workAuthorID }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600">{{ $workAuthorName }}</a>
 				{{ end }}
 			{{ else if $title }}
 				zu <em>{{ $title }}</em>
-			{{ end }}{{ if $place }}({{ $place }}){{ end }}
+			{{ end }}{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
 		{{- end -}}
 
 	{{- else if $hasProklamation -}}
@@ -391,17 +386,16 @@
 			{{- if (or (eq $agentref.Category "") (eq $agentref.Category "autor")) -}}
 				{{- $agent := GetAgent $agentref.Ref -}}{{- if and $agent (gt (len $agent.Names) 0) -}}
 					von
-					<a href="/akteure/{{ $agentref.Ref }}" class="author-link">{{ index $agent.Names 0 }}</a
+					<a href="/akteure/{{ $agentref.Ref }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600">{{ index $agent.Names 0 }}</a
 					>{{- $authorFound = true -}}{{- break -}}
 				{{- end -}}
 
 			{{- end -}}
 
-		{{- end -}}
+		{{- end -}}{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
-		{{ if $place }}aus {{ $place }}{{ end }}
 
 	{{- else if $hasDesertionsliste -}}
-		{{ Safe $fortsPrefix }}Desertionsliste{{ if $place }}für {{ $place }}{{ end }}
+		{{ Safe $fortsPrefix }}Desertionsliste{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
 
 	{{- else if $hasNotenblatt -}}
 		{{ Safe $fortsPrefix }}{{ if $hasNachtrag }}Ergänztes{{ end }}Notenblatt{{ if $title }}
@@ -409,7 +403,7 @@
 		{{ end }}
 
 	{{- else if $hasVorlesungsverzeichnis -}}
-		{{ Safe $fortsPrefix }}Vorlesungsverzeichnis{{ if $place }}der Universität {{ $place }}{{ end }}
+		{{ Safe $fortsPrefix }}Vorlesungsverzeichnis{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
 
 	{{- else if $hasErzaehlung -}}
 		{{- $authorFound := false -}}
@@ -417,7 +411,7 @@
 			{{- if (or (eq $agentref.Category "") (eq $agentref.Category "autor")) -}}
 				{{- $agent := GetAgent $agentref.Ref -}}
 				{{- if and $agent (gt (len $agent.Names) 0) -}}
-					{{ Safe $fortsPrefix }}<a href="/akteure/{{ $agentref.Ref }}" class="author-link"
+					{{ Safe $fortsPrefix }}<a href="/akteure/{{ $agentref.Ref }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600"
 						>{{ index $agent.Names 0 }}</a
 					>,
 					{{ if $hasUebersetzung }}
@@ -447,7 +441,7 @@
 		{{ if $title }}: <em>{{ $title }}</em>{{ end }}
 
 	{{- else if $hasKriminalanzeige -}}
-		{{ Safe $fortsPrefix }}Kriminalanzeige{{ if $place }}aus {{ $place }}{{ end }}
+		{{ Safe $fortsPrefix }}Kriminalanzeige{{ if $place }} <span class="place-tag inline-block bg-slate-200 text-slate-700 text-xs px-2 py-0.5 rounded-md whitespace-nowrap">{{ $place }}</span>{{ end }}
 
 	{{- else if $hasKorrektur -}}
 		{{ Safe $fortsPrefix }}Korrektur{{ if $title }}: <em>{{ $title }}</em>{{ end }}
@@ -461,13 +455,12 @@
 		{{ if $title }}: <em>{{ $title }}</em>{{ end }}
 
 	{{- else if $hasAuszug -}}
-		{{ Safe $fortsPrefix }}Auszug{{ if $title }}: <em>„{{ $title }}"</em>{{ end }}
+		{{ Safe $fortsPrefix }}{{ if $title }}<em>{{ $title }}</em>, {{ end }}{{ if $hasUebersetzung }}Übersetzung aus:{{ else }}Auszug aus:{{ end }} {{ if $workAuthorName }}
-		{{ if $workTitle }}
+			<a href="/akteure/{{ $workAuthorID }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600">{{ $workAuthorName }}</a>, {{ end }}{{ if $workTitle }}<em
-			aus <em>{{ $workTitle }}</em>{{ if $workAuthorName }}
+				class="work-title"
-				von <a href="/akteure/{{ $workAuthorID }}" class="author-link">{{ $workAuthorName }}</a>
+				data-short-title="{{ $workTitle }}"
-			{{ end }}
+				{{ if $workTitleFull }}data-full-title="{{ $workTitleFull }}"{{ end }}
-
+				>{{ $workTitle }}</em>{{ else if $title }}<em>{{ $title }}</em>{{ else }}[Werk unbekannt]{{ end }}
-		{{ end }}
 
 	{{- else -}}
 		{{- $authorFound := false -}}
@@ -475,13 +468,15 @@
 			{{- if (or (eq $agentref.Category "") (eq $agentref.Category "autor")) -}}
 				{{- $agent := GetAgent $agentref.Ref -}}
 				{{- if and $agent (gt (len $agent.Names) 0) -}}
-					{{ Safe $fortsPrefix }}<a href="/akteure/{{ $agentref.Ref }}" class="author-link"
+					{{ Safe $fortsPrefix }}<a href="/akteure/{{ $agentref.Ref }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600"
 						>{{ index $agent.Names 0 }}</a
 					>{{ if $title }}: <em>{{ $title }}</em>{{ end }}{{ if $workTitle }}
-						{{ if $title }}aus{{ end }}<em>{{ $workTitle }}</em>{{ if $workAuthorName }}
+						{{ if $title }}, {{ if $hasUebersetzung }}Übersetzung aus:{{ else }}Auszug aus:{{ end }} {{ end }}{{ if $workAuthorName }}
-							von
+							<a href="/akteure/{{ $workAuthorID }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600">{{ $workAuthorName }}</a>, {{ end }}<em
-							<a href="/akteure/{{ $workAuthorID }}" class="author-link">{{ $workAuthorName }}</a>
+							class="work-title"
-						{{ end }}
+							data-short-title="{{ $workTitle }}"
+							{{ if $workTitleFull }}data-full-title="{{ $workTitleFull }}"{{ end }}
+							>{{ $workTitle }}</em>
 					{{ end }}
 					{{- $authorFound = true -}}
 					{{- break -}}
@@ -490,9 +485,12 @@
 		{{- end -}}
 		{{- if not $authorFound -}}
 			{{ Safe $fortsPrefix }}{{ if $title }}<em>{{ $title }}</em>{{ end }}{{ if $workTitle }}
-				{{ if $title }}aus{{ end }}<em>{{ $workTitle }}</em>{{ if $workAuthorName }}
+				{{ if $title }}, {{ if $hasUebersetzung }}Übersetzung aus:{{ else }}Auszug aus:{{ end }} {{ end }}{{ if $workAuthorName }}
-					von <a href="/akteure/{{ $workAuthorID }}" class="author-link">{{ $workAuthorName }}</a>
+					<a href="/akteure/{{ $workAuthorID }}" class="author-link text-slate-700 hover:text-slate-900 underline decoration-slate-400 hover:decoration-slate-600">{{ $workAuthorName }}</a>, {{ end }}<em
-				{{ end }}
+					class="work-title"
+					data-short-title="{{ $workTitle }}"
+					{{ if $workTitleFull }}data-full-title="{{ $workTitleFull }}"{{ end }}
+					>{{ $workTitle }}</em>
 			{{ else if not $title }}
 				Beitrag ohne Titel
 			{{ end }}

views/routes/ausgabe/components/_newspaper_layout.gohtml

@@ -7,105 +7,9 @@
 		{{ $pages := $images.MainPages }}
 		{{ $pageCount := len $pages }}
 
-		<!-- Dynamic 2-column grid for arbitrary page count -->
+		<!-- Historical printing layout grid -->
 		<div class="grid grid-cols-2 gap-4">
-			{{ range $index, $page := $pages }}
+			{{ template "_historical_layout" (dict "pages" $pages "pageCount" $pageCount "isBeilage" false) }}
-				{{ if $page.Available }}
-					{{ $pageIndex := $index }}
-					{{ $isFirstPage := eq $pageIndex 0 }}
-					{{ $isLastPage := eq $pageIndex (sub $pageCount 1) }}
-					{{ $isOddPosition := eq (mod $pageIndex 2) 0 }}
-					{{ $isEvenPosition := eq (mod $pageIndex 2) 1 }}
-
-					{{ if $isFirstPage }}
-						<!-- Page 1: Always left column -->
-						<div class="newspaper-page-container" id="page-{{ $page.PageNumber }}">
-							<!-- Page indicator row - right aligned for first page -->
-							<div class="flex justify-end items-center gap-1 mb-2">
-								<button onclick="copyPagePermalink('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-blue-100 hover:bg-blue-200 text-blue-700 border border-blue-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Link zu Seite {{ $page.PageNumber }} kopieren">
-									<i class="ri-share-line text-xs"></i>
-								</button>
-								<button onclick="generatePageCitation('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-green-100 hover:bg-green-200 text-green-700 border border-green-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Zitation für Seite {{ $page.PageNumber }} generieren">
-									<i class="ri-file-text-line text-xs"></i>
-								</button>
-								<span class="page-indicator text-sm font-bold text-slate-600 bg-blue-50 px-2 py-1 rounded transition-all duration-300 shadow-sm flex items-center gap-1" data-page="{{ $page.PageNumber }}">
-									{{ $page.PageNumber }}
-									<i class="ri-file-text-line text-black text-sm"></i>
-								</span>
-							</div>
-							<div class="single-page bg-white p-4 rounded border border-slate-200 hover:border-slate-300 transition-colors duration-200">
-								<img src="{{ $page.ImagePath }}" alt="Seite {{ $page.PageNumber }}" class="newspaper-page-image cursor-pointer rounded-md hover:scale-[1.02] transition-transform duration-200" onclick="enlargePage(this, {{ $page.PageNumber }}, false)" data-page="{{ $page.PageNumber }}" loading="lazy" />
-							</div>
-						</div>
-						<!-- Empty space after first page -->
-						<div></div>
-					{{ else if $isLastPage }}
-						<!-- Last page: Always right column with empty space before -->
-						<div></div>
-						<div class="newspaper-page-container" id="page-{{ $page.PageNumber }}">
-							<!-- Page indicator row - left aligned for last page -->
-							<div class="flex justify-start items-center gap-1 mb-2">
-								<span class="page-indicator text-sm font-bold text-slate-600 bg-blue-50 px-2 py-1 rounded transition-all duration-300 shadow-sm flex items-center gap-1" data-page="{{ $page.PageNumber }}">
-									<i class="ri-file-text-line text-black text-sm"></i>
-									{{ $page.PageNumber }}
-								</span>
-								<button onclick="copyPagePermalink('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-blue-100 hover:bg-blue-200 text-blue-700 border border-blue-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Link zu Seite {{ $page.PageNumber }} kopieren">
-									<i class="ri-share-line text-xs"></i>
-								</button>
-								<button onclick="generatePageCitation('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-green-100 hover:bg-green-200 text-green-700 border border-green-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Zitation für Seite {{ $page.PageNumber }} generieren">
-									<i class="ri-file-text-line text-xs"></i>
-								</button>
-							</div>
-							<div class="single-page bg-white p-4 rounded border border-slate-200 hover:border-slate-300 transition-colors duration-200">
-								<img src="{{ $page.ImagePath }}" alt="Seite {{ $page.PageNumber }}" class="newspaper-page-image cursor-pointer rounded-md hover:scale-[1.02] transition-transform duration-200" onclick="enlargePage(this, {{ $page.PageNumber }}, false)" data-page="{{ $page.PageNumber }}" loading="lazy" />
-							</div>
-						</div>
-					{{ else }}
-						<!-- Middle pages: Even pages (index 1,3,5...) left column, Odd pages (index 2,4,6...) right column -->
-						{{ if $isEvenPosition }}
-							<!-- Even-indexed pages: Left column -->
-							<div class="newspaper-page-container" id="page-{{ $page.PageNumber }}">
-								<!-- Page indicator row - right aligned for even-indexed pages -->
-								<div class="flex justify-end items-center gap-1 mb-2">
-									<button onclick="copyPagePermalink('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-blue-100 hover:bg-blue-200 text-blue-700 border border-blue-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Link zu Seite {{ $page.PageNumber }} kopieren">
-										<i class="ri-share-line text-xs"></i>
-									</button>
-									<button onclick="generatePageCitation('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-green-100 hover:bg-green-200 text-green-700 border border-green-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Zitation für Seite {{ $page.PageNumber }} generieren">
-										<i class="ri-file-text-line text-xs"></i>
-									</button>
-									<span class="page-indicator text-sm font-bold text-slate-600 bg-blue-50 px-2 py-1 rounded transition-all duration-300 shadow-sm flex items-center gap-1" data-page="{{ $page.PageNumber }}">
-										{{ $page.PageNumber }}
-										<i class="ri-file-text-line text-black text-sm scale-x-[-1]"></i>
-									</span>
-								</div>
-								<div class="single-page bg-white p-4 rounded border border-slate-200 hover:border-slate-300 transition-colors duration-200">
-									<img src="{{ $page.ImagePath }}" alt="Seite {{ $page.PageNumber }}" class="newspaper-page-image cursor-pointer rounded-md hover:scale-[1.02] transition-transform duration-200" onclick="enlargePage(this, {{ $page.PageNumber }}, false)" data-page="{{ $page.PageNumber }}" loading="lazy" />
-								</div>
-							</div>
-						{{ else }}
-							<!-- Odd-indexed pages: Right column -->
-							<div class="newspaper-page-container" id="page-{{ $page.PageNumber }}">
-								<!-- Page indicator row - left aligned for odd-indexed pages -->
-								<div class="flex justify-start items-center gap-1 mb-2">
-									<span class="page-indicator text-sm font-bold text-slate-600 bg-blue-50 px-2 py-1 rounded transition-all duration-300 shadow-sm flex items-center gap-1" data-page="{{ $page.PageNumber }}">
-										<i class="ri-file-text-line text-black text-sm"></i>
-										{{ $page.PageNumber }}
-									</span>
-									<button onclick="copyPagePermalink('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-blue-100 hover:bg-blue-200 text-blue-700 border border-blue-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Link zu Seite {{ $page.PageNumber }} kopieren">
-										<i class="ri-share-line text-xs"></i>
-									</button>
-									<button onclick="generatePageCitation('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-green-100 hover:bg-green-200 text-green-700 border border-green-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Zitation für Seite {{ $page.PageNumber }} generieren">
-										<i class="ri-file-text-line text-xs"></i>
-									</button>
-								</div>
-								<div class="single-page bg-white p-4 rounded border border-slate-200 hover:border-slate-300 transition-colors duration-200">
-									<img src="{{ $page.ImagePath }}" alt="Seite {{ $page.PageNumber }}" class="newspaper-page-image cursor-pointer rounded-md hover:scale-[1.02] transition-transform duration-200" onclick="enlargePage(this, {{ $page.PageNumber }}, false)" data-page="{{ $page.PageNumber }}" loading="lazy" />
-								</div>
-							</div>
-						{{ end }}
-					{{ end }}
-				{{ end }}
-			{{ end }}
 		</div>
 	{{ end }}
 
@@ -113,7 +17,7 @@
 	<!-- Beilage Pages -->
 	{{ range $beilageNum, $beilagePages := $images.AdditionalPages }}
 		{{ if $beilagePages }}
-			<div class="mt-12 pt-8 border-t-2 border-amber-200">
+			<div class="mt-12 pt-8">
 				<!-- Header for beilage -->
 				<div class="flex items-center gap-3 mb-6 bg-amber-50 px-4 py-3 rounded border border-amber-200">
 					<i class="ri-attachment-line text-2xl text-amber-600"></i>
@@ -121,150 +25,10 @@
 				</div>
 				{{ $pageCount := len $beilagePages }}
 
-				<!-- Dynamic layout for Beilage pages -->
+				<!-- Historical printing layout grid for Beilage -->
-				{{ if eq $pageCount 2 }}
+				<div class="grid grid-cols-2 gap-4">
-					<!-- Special case: 2 pages side by side -->
+					{{ template "_historical_layout" (dict "pages" $beilagePages "pageCount" $pageCount "isBeilage" true) }}
-					<div class="grid grid-cols-2 gap-4">
+				</div>
-						{{ range $index, $page := $beilagePages }}
-							{{ if $page.Available }}
-								<div class="newspaper-page-container" id="beilage-{{ $beilageNum }}-page-{{ $page.PageNumber }}">
-									<!-- Page indicator row - left aligned for first page, right for second -->
-									<div class="flex {{ if eq $index 0 }}justify-start{{ else }}justify-end{{ end }} items-center gap-1 mb-2">
-										{{ if eq $index 0 }}
-											<!-- Left page: page indicator first, then buttons -->
-											<span class="page-indicator text-sm font-bold text-slate-600 bg-amber-50 px-2 py-1 rounded transition-all duration-300 shadow-sm flex items-center gap-1" data-page="{{ $page.PageNumber }}">
-												<i class="ri-file-text-line text-amber-600 text-sm"></i>
-												{{ $page.PageNumber }}
-											</span>
-											<button onclick="copyPagePermalink('{{ $page.PageNumber }}', this, true)" class="w-6 h-6 bg-blue-100 hover:bg-blue-200 text-blue-700 border border-blue-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Link zu Seite {{ $page.PageNumber }} kopieren">
-												<i class="ri-share-line text-xs"></i>
-											</button>
-											<button onclick="generatePageCitation('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-green-100 hover:bg-green-200 text-green-700 border border-green-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Zitation für Seite {{ $page.PageNumber }} generieren">
-												<i class="ri-file-text-line text-xs"></i>
-											</button>
-										{{ else }}
-											<!-- Right page: buttons first, then page indicator -->
-											<button onclick="copyPagePermalink('{{ $page.PageNumber }}', this, true)" class="w-6 h-6 bg-blue-100 hover:bg-blue-200 text-blue-700 border border-blue-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Link zu Seite {{ $page.PageNumber }} kopieren">
-												<i class="ri-share-line text-xs"></i>
-											</button>
-											<button onclick="generatePageCitation('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-green-100 hover:bg-green-200 text-green-700 border border-green-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Zitation für Seite {{ $page.PageNumber }} generieren">
-												<i class="ri-file-text-line text-xs"></i>
-											</button>
-											<span class="page-indicator text-sm font-bold text-slate-600 bg-amber-50 px-2 py-1 rounded transition-all duration-300 shadow-sm flex items-center gap-1" data-page="{{ $page.PageNumber }}">
-												{{ $page.PageNumber }}
-												<i class="ri-file-text-line text-amber-600 text-sm"></i>
-											</span>
-										{{ end }}
-									</div>
-									<div class="single-page bg-white p-4 rounded border border-amber-200 hover:border-amber-300 transition-colors duration-200">
-										<img src="{{ $page.ImagePath }}" alt="Beilage {{ $beilageNum }}, Seite {{ $page.PageNumber }}" class="newspaper-page-image cursor-pointer rounded-md hover:scale-[1.02] transition-transform duration-200" onclick="enlargePage(this, {{ $page.PageNumber }}, false)" data-page="{{ $page.PageNumber }}" loading="lazy" />
-									</div>
-								</div>
-							{{ end }}
-						{{ end }}
-					</div>
-				{{ else }}
-					<!-- Standard newspaper layout for 4+ pages -->
-					<div class="grid grid-cols-2 gap-4">
-						{{ range $index, $page := $beilagePages }}
-							{{ if $page.Available }}
-								{{ $pageIndex := $index }}
-								{{ $isFirstPage := eq $pageIndex 0 }}
-								{{ $isLastPage := eq $pageIndex (sub $pageCount 1) }}
-								{{ $isOddPosition := eq (mod $pageIndex 2) 0 }}
-								{{ $isEvenPosition := eq (mod $pageIndex 2) 1 }}
-
-								{{ if $isFirstPage }}
-									<!-- Page 1: Always left column -->
-									<div class="newspaper-page-container" id="beilage-{{ $beilageNum }}-page-{{ $page.PageNumber }}">
-										<!-- Page indicator row - right aligned for Beilage first page -->
-										<div class="flex justify-end items-center gap-1 mb-2">
-											<button onclick="copyPagePermalink('{{ $page.PageNumber }}', this, true)" class="w-6 h-6 bg-blue-100 hover:bg-blue-200 text-blue-700 border border-blue-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Link zu Seite {{ $page.PageNumber }} kopieren">
-												<i class="ri-share-line text-xs"></i>
-											</button>
-											<button onclick="generatePageCitation('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-green-100 hover:bg-green-200 text-green-700 border border-green-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Zitation für Seite {{ $page.PageNumber }} generieren">
-												<i class="ri-file-text-line text-xs"></i>
-											</button>
-											<span class="page-indicator text-sm font-bold text-slate-600 bg-amber-50 px-2 py-1 rounded transition-all duration-300 shadow-sm flex items-center gap-1" data-page="{{ $page.PageNumber }}">
-												{{ $page.PageNumber }}
-												<i class="ri-file-text-line text-amber-600 text-sm"></i>
-											</span>
-										</div>
-										<div class="single-page bg-white p-4 rounded border border-amber-200 hover:border-amber-300 transition-colors duration-200">
-											<img src="{{ $page.ImagePath }}" alt="Beilage {{ $beilageNum }}, Seite {{ $page.PageNumber }}" class="newspaper-page-image cursor-pointer rounded-md hover:scale-[1.02] transition-transform duration-200" onclick="enlargePage(this, {{ $page.PageNumber }}, false)" data-page="{{ $page.PageNumber }}" loading="lazy" />
-										</div>
-									</div>
-									<!-- Empty space after first page -->
-									<div></div>
-								{{ else if $isLastPage }}
-									<!-- Last page: Always right column with empty space before -->
-									<div></div>
-									<div class="newspaper-page-container" id="beilage-{{ $beilageNum }}-page-{{ $page.PageNumber }}">
-										<!-- Page indicator row - left aligned for Beilage last page -->
-										<div class="flex justify-start items-center gap-1 mb-2">
-											<span class="page-indicator text-sm font-bold text-slate-600 bg-amber-50 px-2 py-1 rounded transition-all duration-300 shadow-sm flex items-center gap-1" data-page="{{ $page.PageNumber }}">
-												<i class="ri-file-text-line text-amber-600 text-sm"></i>
-												{{ $page.PageNumber }}
-											</span>
-											<button onclick="copyPagePermalink('{{ $page.PageNumber }}', this, true)" class="w-6 h-6 bg-blue-100 hover:bg-blue-200 text-blue-700 border border-blue-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Link zu Seite {{ $page.PageNumber }} kopieren">
-												<i class="ri-share-line text-xs"></i>
-											</button>
-											<button onclick="generatePageCitation('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-green-100 hover:bg-green-200 text-green-700 border border-green-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Zitation für Seite {{ $page.PageNumber }} generieren">
-												<i class="ri-file-text-line text-xs"></i>
-											</button>
-										</div>
-										<div class="single-page bg-white p-4 rounded border border-amber-200 hover:border-amber-300 transition-colors duration-200">
-											<img src="{{ $page.ImagePath }}" alt="Beilage {{ $beilageNum }}, Seite {{ $page.PageNumber }}" class="newspaper-page-image cursor-pointer rounded-md hover:scale-[1.02] transition-transform duration-200" onclick="enlargePage(this, {{ $page.PageNumber }}, false)" data-page="{{ $page.PageNumber }}" loading="lazy" />
-										</div>
-									</div>
-								{{ else }}
-									<!-- Middle pages: Even pages left column, Odd pages right column -->
-									{{ if $isEvenPosition }}
-										<!-- Even-indexed pages: Left column -->
-										<div class="newspaper-page-container" id="beilage-{{ $beilageNum }}-page-{{ $page.PageNumber }}">
-											<!-- Page indicator row - right aligned for Beilage even-indexed pages -->
-											<div class="flex justify-end items-center gap-1 mb-2">
-												<button onclick="copyPagePermalink('{{ $page.PageNumber }}', this, true)" class="w-6 h-6 bg-blue-100 hover:bg-blue-200 text-blue-700 border border-blue-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Link zu Seite {{ $page.PageNumber }} kopieren">
-													<i class="ri-share-line text-xs"></i>
-												</button>
-												<button onclick="generatePageCitation('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-green-100 hover:bg-green-200 text-green-700 border border-green-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Zitation für Seite {{ $page.PageNumber }} generieren">
-													<i class="ri-file-text-line text-xs"></i>
-												</button>
-												<span class="page-indicator text-sm font-bold text-slate-600 bg-amber-50 px-2 py-1 rounded transition-all duration-300 shadow-sm flex items-center gap-1" data-page="{{ $page.PageNumber }}">
-													{{ $page.PageNumber }}
-													<i class="ri-file-text-line text-amber-600 text-sm scale-x-[-1]"></i>
-												</span>
-											</div>
-											<div class="single-page bg-white p-4 rounded border border-amber-200 hover:border-amber-300 transition-colors duration-200">
-												<img src="{{ $page.ImagePath }}" alt="Beilage {{ $beilageNum }}, Seite {{ $page.PageNumber }}" class="newspaper-page-image cursor-pointer rounded-md hover:scale-[1.02] transition-transform duration-200" onclick="enlargePage(this, {{ $page.PageNumber }}, false)" data-page="{{ $page.PageNumber }}" loading="lazy" />
-											</div>
-										</div>
-									{{ else }}
-										<!-- Odd-indexed pages: Right column -->
-										<div class="newspaper-page-container" id="beilage-{{ $beilageNum }}-page-{{ $page.PageNumber }}">
-											<!-- Page indicator row - left aligned for Beilage odd-indexed pages -->
-											<div class="flex justify-start items-center gap-1 mb-2">
-												<span class="page-indicator text-sm font-bold text-slate-600 bg-amber-50 px-2 py-1 rounded transition-all duration-300 shadow-sm flex items-center gap-1" data-page="{{ $page.PageNumber }}">
-													<i class="ri-file-text-line text-amber-600 text-sm"></i>
-													{{ $page.PageNumber }}
-												</span>
-												<button onclick="copyPagePermalink('{{ $page.PageNumber }}', this, true)" class="w-6 h-6 bg-blue-100 hover:bg-blue-200 text-blue-700 border border-blue-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Link zu Seite {{ $page.PageNumber }} kopieren">
-													<i class="ri-share-line text-xs"></i>
-												</button>
-												<button onclick="generatePageCitation('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-green-100 hover:bg-green-200 text-green-700 border border-green-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Zitation für Seite {{ $page.PageNumber }} generieren">
-													<i class="ri-file-text-line text-xs"></i>
-												</button>
-											</div>
-											<div class="single-page bg-white p-4 rounded border border-amber-200 hover:border-amber-300 transition-colors duration-200">
-												<img src="{{ $page.ImagePath }}" alt="Beilage {{ $beilageNum }}, Seite {{ $page.PageNumber }}" class="newspaper-page-image cursor-pointer rounded-md hover:scale-[1.02] transition-transform duration-200" onclick="enlargePage(this, {{ $page.PageNumber }}, false)" data-page="{{ $page.PageNumber }}" loading="lazy" />
-											</div>
-										</div>
-									{{ end }}
-								{{ end }}
-							{{ end }}
-						{{ end }}
-					</div>
-				{{ end }}
 			</div>
 		{{ end }}
 	{{ end }}
@@ -1287,3 +1051,119 @@
 		}
 	}
 </script>
+
+<!-- Historical printing layout template -->
+{{ define "_historical_layout" }}
+	{{ $pages := .pages }}
+	{{ $pageCount := .pageCount }}
+	{{ $isBeilage := .isBeilage }}
+
+	{{ if eq $pageCount 2 }}
+		<!-- 2 pages: [1] [2] -->
+		{{ template "_render_page" (dict "page" (index $pages 0) "position" "left" "isBeilage" $isBeilage) }}
+		{{ template "_render_page" (dict "page" (index $pages 1) "position" "right" "isBeilage" $isBeilage) }}
+	{{ else if eq $pageCount 4 }}
+		<!-- 4 pages: [1] [_] \n [2] [3] \n [_] [4] -->
+		{{ template "_render_page" (dict "page" (index $pages 0) "position" "left" "isBeilage" $isBeilage) }}
+		{{ template "_render_empty" "" }}
+		{{ template "_render_page" (dict "page" (index $pages 1) "position" "left" "isBeilage" $isBeilage) }}
+		{{ template "_render_page" (dict "page" (index $pages 2) "position" "right" "isBeilage" $isBeilage) }}
+		{{ template "_render_empty" "" }}
+		{{ template "_render_page" (dict "page" (index $pages 3) "position" "right" "isBeilage" $isBeilage) }}
+	{{ else if eq $pageCount 6 }}
+		<!-- 6 pages: [1] [_] \n [2] [3] \n [_] [4] \n [5] [6] -->
+		{{ template "_render_page" (dict "page" (index $pages 0) "position" "left" "isBeilage" $isBeilage) }}
+		{{ template "_render_empty" "" }}
+		{{ template "_render_page" (dict "page" (index $pages 1) "position" "left" "isBeilage" $isBeilage) }}
+		{{ template "_render_page" (dict "page" (index $pages 2) "position" "right" "isBeilage" $isBeilage) }}
+		{{ template "_render_empty" "" }}
+		{{ template "_render_page" (dict "page" (index $pages 3) "position" "right" "isBeilage" $isBeilage) }}
+		{{ template "_render_page" (dict "page" (index $pages 4) "position" "left" "isBeilage" $isBeilage) }}
+		{{ template "_render_page" (dict "page" (index $pages 5) "position" "right" "isBeilage" $isBeilage) }}
+	{{ else if eq $pageCount 8 }}
+		<!-- 8 pages: [1] [_] \n [2] [3] \n [4] [5] \n [6] [_] \n [_] [7] \n [8] [_] -->
+		{{ template "_render_page" (dict "page" (index $pages 0) "position" "left" "isBeilage" $isBeilage) }}
+		{{ template "_render_empty" "" }}
+		{{ template "_render_page" (dict "page" (index $pages 1) "position" "left" "isBeilage" $isBeilage) }}
+		{{ template "_render_page" (dict "page" (index $pages 2) "position" "right" "isBeilage" $isBeilage) }}
+		{{ template "_render_page" (dict "page" (index $pages 3) "position" "left" "isBeilage" $isBeilage) }}
+		{{ template "_render_page" (dict "page" (index $pages 4) "position" "right" "isBeilage" $isBeilage) }}
+		{{ template "_render_page" (dict "page" (index $pages 5) "position" "left" "isBeilage" $isBeilage) }}
+		{{ template "_render_empty" "" }}
+		{{ template "_render_empty" "" }}
+		{{ template "_render_page" (dict "page" (index $pages 6) "position" "right" "isBeilage" $isBeilage) }}
+		{{ template "_render_page" (dict "page" (index $pages 7) "position" "left" "isBeilage" $isBeilage) }}
+		{{ template "_render_empty" "" }}
+	{{ else }}
+		<!-- Fallback: side by side layout for other page counts -->
+		{{ range $index, $page := $pages }}
+			{{ if eq (mod $index 2) 0 }}
+				{{ template "_render_page" (dict "page" $page "position" "left" "isBeilage" $isBeilage) }}
+			{{ else }}
+				{{ template "_render_page" (dict "page" $page "position" "right" "isBeilage" $isBeilage) }}
+			{{ end }}
+		{{ end }}
+	{{ end }}
+{{ end }}
+
+<!-- Page rendering template -->
+{{ define "_render_page" }}
+	{{ $page := .page }}
+	{{ $position := .position }}
+	{{ $isBeilage := .isBeilage }}
+	{{ $isLeft := eq $position "left" }}
+	{{ $borderColor := "border-slate-200" }}
+	{{ $hoverColor := "hover:border-slate-300" }}
+	{{ $bgColor := "bg-blue-50" }}
+	{{ $idPrefix := "page" }}
+	{{ $linkPrefix := "" }}
+
+	{{ if $isBeilage }}
+		{{ $borderColor = "border-amber-200" }}
+		{{ $hoverColor = "hover:border-amber-300" }}
+		{{ $bgColor = "bg-amber-50" }}
+		{{ $idPrefix = "beilage-1-page" }}
+		{{ $linkPrefix = "#beilage-1-page-" }}
+	{{ else }}
+		{{ $linkPrefix = "#page-" }}
+	{{ end }}
+
+	<div class="newspaper-page-container" id="{{ $idPrefix }}-{{ $page.PageNumber }}">
+		<!-- Page indicator row -->
+		<div class="flex {{ if $isLeft }}justify-end{{ else }}justify-start{{ end }} items-center gap-1 mb-2">
+			{{ if $isLeft }}
+				<!-- Left page: buttons then page number -->
+				<button onclick="copyPagePermalink('{{ $page.PageNumber }}', this{{ if $isBeilage }}, true{{ end }})" class="w-6 h-6 bg-blue-100 hover:bg-blue-200 text-blue-700 border border-blue-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Link zu Seite {{ $page.PageNumber }} kopieren">
+					<i class="ri-share-line text-xs"></i>
+				</button>
+				<button onclick="generatePageCitation('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-green-100 hover:bg-green-200 text-green-700 border border-green-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Zitation für Seite {{ $page.PageNumber }} generieren">
+					<i class="ri-file-text-line text-xs"></i>
+				</button>
+				<span class="page-indicator text-sm font-bold text-slate-600 {{ $bgColor }} px-2 py-1 rounded transition-all duration-300 shadow-sm flex items-center gap-1" data-page="{{ $page.PageNumber }}">
+					{{ $page.PageNumber }}
+					<i class="ri-file-text-line {{ if $isBeilage }}text-amber-600{{ else }}text-black{{ end }} text-sm scale-x-[-1]"></i>
+				</span>
+			{{ else }}
+				<!-- Right page: page number then buttons -->
+				<span class="page-indicator text-sm font-bold text-slate-600 {{ $bgColor }} px-2 py-1 rounded transition-all duration-300 shadow-sm flex items-center gap-1" data-page="{{ $page.PageNumber }}">
+					<i class="ri-file-text-line {{ if $isBeilage }}text-amber-600{{ else }}text-black{{ end }} text-sm"></i>
+					{{ $page.PageNumber }}
+				</span>
+				<button onclick="copyPagePermalink('{{ $page.PageNumber }}', this{{ if $isBeilage }}, true{{ end }})" class="w-6 h-6 bg-blue-100 hover:bg-blue-200 text-blue-700 border border-blue-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Link zu Seite {{ $page.PageNumber }} kopieren">
+					<i class="ri-share-line text-xs"></i>
+				</button>
+				<button onclick="generatePageCitation('{{ $page.PageNumber }}', this)" class="w-6 h-6 bg-green-100 hover:bg-green-200 text-green-700 border border-green-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer" title="Zitation für Seite {{ $page.PageNumber }} generieren">
+					<i class="ri-file-text-line text-xs"></i>
+				</button>
+			{{ end }}
+		</div>
+		<div class="single-page bg-white p-4 rounded border {{ $borderColor }} {{ $hoverColor }} transition-colors duration-200">
+			<img src="{{ $page.ImagePath }}" alt="{{ if $isBeilage }}Beilage 1, {{ end }}Seite {{ $page.PageNumber }}" class="newspaper-page-image cursor-pointer rounded-sm hover:scale-[1.02] transition-transform duration-200" onclick="enlargePage(this, {{ $page.PageNumber }}, false)" data-page="{{ $page.PageNumber }}" loading="lazy" />
+		</div>
+	</div>
+{{ end }}
+
+<!-- Empty space template -->
+{{ define "_render_empty" }}
+	<div class="newspaper-empty-space"></div>
+{{ end }}

views/routes/ausgabe/components/_title_nav.gohtml

@@ -40,7 +40,7 @@
 		</div>
 		<div class="text-base font-medium text-slate-700 bg-slate-100 px-2 py-1 rounded">
 			<span class="pr-1">{{ printf "%.2s" (WeekdayName $date.Weekday) }}</span>
-			<b>{{ $date.Day }}. {{ $date.MonthNameShort }}</b>
+			{{ $date.Day }}. {{ $date.MonthNameShort }}. <b>{{ $date.Year }}</b>
 		</div>
 	</div>
 </div>

xmlmodels/references.go

@@ -33,6 +33,7 @@ type IssueRef struct {
 	Von     int      `xml:"von,attr"`
 	Bis     int      `xml:"bis,attr"`
 	Beilage int      `xml:"beilage,attr"`
+	Order   int      `xml:"order,attr"`
 	DateAttributes
 	Reference // Nicht im Schema
 }