Vier Darstellungen fuer die Beitragsliste

Karten (Raster mit Bild oben), Liste (Bild links, Text rechts), Kompakt
(nur Titel und Datum) und Wechselseitig (Bild mal links, mal rechts).
Dieselben Daten, dasselbe Markup - nur eine Klasse wechselt.

Die erste Fassung von "Wechselseitig" war ein umgedrehter Flexkasten und
sah auch so aus. Jetzt sitzt das Bild in einer Karte mit Ecken, Schatten
und festem Verhaeltnis, der Text hat eine Nummer aus einem CSS-Zaehler,
eine begrenzte Zeilenlaenge und einen sichtbaren Verweis, und zwischen den
Reihen liegt eine feine Linie.

Zwei Details: die Karte ist das Listenelement, also zaehlt :nth-child auf
ihr - die erste Fassung wechselte deshalb gar nicht. Und die Umkehrung
laeuft ueber order statt row-reverse, damit auf dem Telefon sauber wieder
Bild ueber Text steht.

Geprueft: 399 Tests unter PHP 8.2 und 8.4, 18 JS-Tests, Editortest,
Browserpruefung, axe ohne Verstoss auf allen vier Darstellungen.

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

templates/blocks/post-list.html.twig

@@ -2,10 +2,11 @@
 {% if posts is empty %}
     <p class="post-empty">Hier erscheinen die Beiträge, sobald welche veröffentlicht sind.</p>
 {% else %}
-<ul class="post-list">
+{% set art = layout|default('karten') %}
+<ul class="post-list post-list-{{ art }}">
     {% for post in posts %}
     <li class="post-card">
-        {% if post.image %}
+        {% if post.image and art != 'kompakt' %}
         <a class="post-image" href="{{ post.href }}" tabindex="-1" aria-hidden="true">
             <img src="{{ post.image.variants|last.src }}" alt="" width="{{ post.image.variants|last.width }}" height="{{ post.image.variants|last.height }}" loading="lazy" decoding="async"
                  srcset="{% for source in post.image.variants %}{{ source.src }} {{ source.width }}w{% if not loop.last %}, {% endif %}{% endfor %}" sizes="(max-width: 650px) 100vw, 380px">
@@ -23,6 +24,7 @@
             </p>
             {% endif %}
             {% if (showExcerpt ?? true) and post.excerpt %}<p class="post-excerpt">{{ post.excerpt }}</p>{% endif %}
+            {% if art == 'wechsel' %}<span class="post-more" aria-hidden="true">Weiterlesen</span>{% endif %}
             {% if (showTerms ?? true) and post.terms.category is not empty %}
             <p class="post-terms">{% for term in post.terms.category %}<a href="{{ term.href }}">{{ term.name }}</a>{% endfor %}</p>
             {% endif %}