From e0dd316eb6046413a151ad56bdf04a39fef938fa Mon Sep 17 00:00:00 2001
From: rcourtman <courtmanr@gmail.com>
Date: Fri, 20 Mar 2026 10:14:45 +0000
Subject: [PATCH] Restore responsive summary grid

---
 .../v6/internal/subsystems/unified-resources.md             | 4 ++--
 .../src/components/Infrastructure/ResourceDetailDrawer.tsx  | 2 +-
 .../__tests__/ResourceDetailDrawer.history.test.tsx         | 6 +++---
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/docs/release-control/v6/internal/subsystems/unified-resources.md b/docs/release-control/v6/internal/subsystems/unified-resources.md
index 5028ce762..a8a8b1f9c 100644
--- a/docs/release-control/v6/internal/subsystems/unified-resources.md
+++ b/docs/release-control/v6/internal/subsystems/unified-resources.md
@@ -269,8 +269,8 @@ The overview now begins with one primary `Summary` shell instead of separate
 peer `Runtime` and `Identity` cards, so current state and canonical identity
 read as one first-screen answer rather than two adjacent mini-surfaces.
 That summary shell now reads as one linear current-state and identity column
-instead of a split two-pane grid, so the first read stays sequential rather
-than asking the operator to compare two side-by-side blocks.
+with a responsive two-column grid on wider screens, so the first read stays
+compact without making the operator scan a stack of nested cards.
 The drawer header now stays focused on canonical identity and source/type
 badges only, while workload/service drill-down links and Kubernetes platform
 signals live with the summary shell, so the top strip does not compete with
diff --git a/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx b/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx
index 534b4c260..e5ee3c544 100644
--- a/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx
+++ b/frontend-modern/src/components/Infrastructure/ResourceDetailDrawer.tsx
@@ -914,7 +914,7 @@ const DrawerContent: Component<ResourceDetailDrawerProps> = (props) => {
             <div class="text-[11px] font-medium uppercase tracking-wide text-base-content">
               Summary
             </div>
-            <div class="mt-3 grid gap-4">
+            <div class="mt-3 grid gap-4 sm:grid-cols-2">
               <div data-testid="resource-current-state-section">
                 <div class="mb-2 text-[10px] font-medium uppercase tracking-wide text-base-content">
                   Current state
diff --git a/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.history.test.tsx b/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.history.test.tsx
index 74f9aeab5..e9045e150 100644
--- a/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.history.test.tsx
+++ b/frontend-modern/src/components/Infrastructure/__tests__/ResourceDetailDrawer.history.test.tsx
@@ -195,9 +195,9 @@ describe('ResourceDetailDrawer change history section', () => {
       screen.getByTestId('resource-summary-section').querySelectorAll('.bg-surface-hover.px-2.py-2')
         .length,
     ).toBe(0);
-    expect(
-      screen.getByTestId('resource-summary-section').querySelector('.mt-3.space-y-4'),
-    ).toBeNull();
+    const summarySection = screen.getByTestId('resource-summary-section');
+    expect(summarySection.querySelector('.mt-3.grid.gap-4')).toBeTruthy();
+    expect(summarySection.querySelector('.mt-3.grid.gap-4')?.classList.contains('sm:grid-cols-2')).toBe(true);
     expect(
       screen.getByTestId('resource-change-history-section').querySelector('.mt-3.grid.gap-2'),
     ).toBeNull();