From 2e19b3aecc802d91abcc985fc1fef2499eedb8b5 Mon Sep 17 00:00:00 2001
From: Johannes Feustel <s@feustel.eu>
Date: Fri, 2 Oct 2026 15:18:17 +0200
Subject: [PATCH] [BUGFIX] Show single cards in the order view at full width

TYPO3 v14 lays out div.card-container as a grid of fixed-width cards.
The order view wraps the comment card and the ordered items card each
in their own card-container, so both shrink to card width and the items
table gets cut off.

The styleguide uses card-container only to group several cards in a
row. Drop the wrapper around these single cards; the address and
properties partials, which group several cards, keep theirs.
---
 .../Templates/Backend/Order/Order/Show.html   | 22 ++++++++-----------
 1 file changed, 9 insertions(+), 13 deletions(-)

diff --git a/Resources/Private/Templates/Backend/Order/Order/Show.html b/Resources/Private/Templates/Backend/Order/Order/Show.html
index 73b50ded..296ce882 100644
--- a/Resources/Private/Templates/Backend/Order/Order/Show.html
+++ b/Resources/Private/Templates/Backend/Order/Order/Show.html
@@ -24,22 +24,18 @@ <h1>
         </div>
 
         <f:if condition="{orderItem.comment}">
-            <div class="card-container mb-3">
-                <div class="card p-4">
-                    <h4>
-                        <f:translate key="tx_cart.backend.order.comment"/>
-                    </h4>
-                    {orderItem.comment -> f:sanitize.html()}
-                </div>
-            </div>
-        </f:if>
-        <div class="card-container">
-            <div class="card p-4">
+            <div class="card p-4 mb-3">
                 <h4>
-                    <f:translate key="tx_cart.backend.order.items"/>
+                    <f:translate key="tx_cart.backend.order.comment"/>
                 </h4>
-                <f:render partial="Backend/Order/Show/Cart" arguments="{orderItem: orderItem}"/>
+                {orderItem.comment -> f:sanitize.html()}
             </div>
+        </f:if>
+        <div class="card p-4">
+            <h4>
+                <f:translate key="tx_cart.backend.order.items"/>
+            </h4>
+            <f:render partial="Backend/Order/Show/Cart" arguments="{orderItem: orderItem}"/>
         </div>
     </div>
 </f:section>