feat: add a textimage element, add news design, add a footer

packages/base/Resources/Private/Extensions/News/Templates/News/List.html

@@ -0,0 +1,55 @@
+<f:layout name="General" />
+<f:section name="content">
+  <f:if condition="{news}">
+    <f:then>
+      <div class="news-list-container">
+        <!-- First 4 items: 1 large on the left and 3 stacked on the right -->
+        <f:if condition="{news -> f:count()} > 0">
+          <div class="news-featured-wrapper">
+            <div class="news-featured-item">
+              <f:for each="{news}" as="item" iteration="iterator">
+                <f:if condition="{iterator.index} == 0">
+                  <f:then>
+                    <f:render partial="News/ItemFeatured" arguments="{newsItem: item}" />
+                  </f:then>
+                </f:if>
+              </f:for>
+            </div>
+            <div class="news-side-items">
+              <f:for each="{news}" as="item" iteration="iterator">
+                <f:if condition="{iterator.index} > 0 && {iterator.index} < 4">
+                  <f:then>
+                    <f:render partial="News/ItemSide" arguments="{newsItem: item}" />
+                  </f:then>
+                </f:if>
+              </f:for>
+            </div>
+          </div>
+        </f:if>
+
+        <!-- Remaining items in a responsive grid of 3 columns -->
+        <f:if condition="{news -> f:count()} > 4">
+          <div class="news-list-grid">
+            <f:for each="{news}" as="item" iteration="iterator">
+              <f:if condition="{iterator.index} >= 4">
+                <f:then>
+                  <f:render partial="News/ItemGrid" arguments="{newsItem: item}" />
+                </f:then>
+              </f:if>
+            </f:for>
+          </div>
+        </f:if>
+
+        <!-- "Alle anzeigen" button if listPid is set -->
+        <f:if condition="{settings.listPid}">
+          <div class="news-show-all">
+            <f:link.page pageUid="{settings.listPid}" class="btn-show-all">Alle anzeigen</f:link.page>
+          </div>
+        </f:if>
+      </div>
+    </f:then>
+    <f:else>
+      <p>No news available.</p>
+    </f:else>
+  </f:if>
+</f:section>