Historie-Hero: Originaltext + Original-Hero-Bild der alten Seite (img-Komponente um Einzeldatei-Modus erweitert)

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

app/components/img.php

@@ -3,8 +3,9 @@
 declare(strict_types=1);
 
 /**
- * Responsives Bild aus Varianten-Set. Props:
+ * Responsives Bild aus Varianten-Set ODER Einzeldatei. Props:
- *   $image  array{base: string, widths: int[], alt: string} — base relativ zu assets/, Dateien: <base>-<w>.jpg
+ *   $image  array{base: string, widths: int[], alt: string} — Varianten <base>-<w>.jpg
+ *           ODER array{src: string, width: int, height: int, alt: string} — Originaldatei 1:1
  *   $sizes  string (optional, default '100vw')
  *   $eager  bool (optional) — above the fold: eager + fetchpriority high
  *   $class  string (optional)
@@ -13,6 +14,14 @@ $sizes = $sizes ?? '100vw';
 $eager = $eager ?? false;
 $class = $class ?? '';
 
+if (!empty($image['src'])): ?>
+<img<?= $class !== '' ? ' class="' . e($class) . '"' : '' ?>
+    src="<?= e(asset($image['src'])) ?>"
+    alt="<?= e($image['alt']) ?>"
+    width="<?= e($image['width']) ?>" height="<?= e($image['height']) ?>"
+    <?= $eager ? 'loading="eager" fetchpriority="high"' : 'loading="lazy" decoding="async"' ?>>
+<?php return; endif;
+
 $widths = $image['widths'];
 $largest = max($widths);
 $srcset = implode(', ', array_map(

app/pages/historie.php

@@ -15,9 +15,4 @@ $meta = [
 ];
 
 component('hero', ['hero' => $historie['hero']]);
-?>
-        <div class="container section--slim">
-            <p class="timeline-intro"><?= e($historie['intro']) ?></p>
-        </div>
-<?php
 component('timeline', ['events' => $historie['events']]);

data/historie.json

@@ -2,15 +2,15 @@
   "hero": {
     "align": "center",
     "compact": true,
-    "title": "Vereinshistorie",
+    "title": "Historie",
-    "tagline": "Der Katzbachtaler Weg seit 1908",
+    "text": "Wir sind seit über 100 Jahren dein Sportverein in der Kulmbacher Region. Erlebe unsere einzigartige Geschichte und die Entstehung der Hans-Rausch-Sportanlage.",
     "image": {
-      "base": "img/pages/vereinsgelaende",
+      "src": "img/historie/1972-sportheim.jpg",
-      "widths": [1000, 1600],
+      "width": 519,
-      "alt": "Luftaufnahme der Hans-Rausch-Sportanlage im Katzbachtal"
+      "height": 272,
+      "alt": "Einweihung des Sportheims im Katzbachtal 1972"
     }
   },
-  "intro": "Erlebe die bewegte Geschichte des TSV 08 Kulmbach – von den ersten Spielen an der Bayreuther Straße bis zur Hans-Rausch-Sportanlage im Katzbachtal.",
   "events": [
     {
       "year": "1947",