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:
- *   $image  array{base: string, widths: int[], alt: string} — base relativ zu assets/, Dateien: <base>-<w>.jpg
+ * Responsives Bild aus Varianten-Set ODER Einzeldatei. Props:
+ *   $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']]);