From 59c2913d7234a4d864dc509c6904f35403f939c8 Mon Sep 17 00:00:00 2001 From: claude_code Date: Sun, 21 Jun 2026 20:51:44 +0300 Subject: [PATCH] style(ai-chat): widen role cards to fill the chat window Role cards in the new-chat empty state were capped at max-width 200px and never grew, leaving large side gaps in a wide window. Make the cards flex to fill each row (flex: 1 1 240px) and raise min/max width so they get wider and use the available window width while still wrapping to ~2 columns at the default window size. --- .../src/features/ai-chat/components/role-cards.module.css | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/apps/client/src/features/ai-chat/components/role-cards.module.css b/apps/client/src/features/ai-chat/components/role-cards.module.css index 94e7c2fb..71d0089a 100644 --- a/apps/client/src/features/ai-chat/components/role-cards.module.css +++ b/apps/client/src/features/ai-chat/components/role-cards.module.css @@ -24,8 +24,12 @@ align-items: center; justify-content: center; gap: 4px; - min-width: 140px; - max-width: 200px; + /* Grow to fill the row so cards use the available window width instead of + leaving large side gaps; the flex-basis sets how many fit per row before + wrapping (≈2 columns at the default window width, more as it widens). */ + flex: 1 1 240px; + min-width: 200px; + max-width: 360px; min-height: 90px; padding: 12px 10px; border-radius: var(--mantine-radius-md);