From 82c2527b2f3c3b4064810ab34a706e41fbc7ed51 Mon Sep 17 00:00:00 2001
From: DCCA <dcca12@gmail.com>
Date: Sat, 20 Jun 2026 21:52:35 -0300
Subject: [PATCH] fix(web): prevent dashboard source-health card mobile
 overflow

The long mono source URL uses whitespace-nowrap (truncate); CSS grid items
default to min-width:auto, so the card refused to shrink below the full
string width, causing ~27px horizontal overflow at 390px. Add min-w-0 to the
card grid item (the earlier min-w-0 was only on the inner text column).

Caught by the /visual-verify mobile pass.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 web/src/features/dashboard/DashboardPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/src/features/dashboard/DashboardPage.tsx b/web/src/features/dashboard/DashboardPage.tsx
index 40fd316..ecb136c 100644
--- a/web/src/features/dashboard/DashboardPage.tsx
+++ b/web/src/features/dashboard/DashboardPage.tsx
@@ -139,7 +139,7 @@ export function DashboardPage() {
           </CardHeader>
           <CardContent className="grid gap-3 md:grid-cols-2 xl:grid-cols-3">
             {sourceHealth.slice(0, 6).map((item) => (
-              <div key={`${item.kind}:${item.source}`} className="rounded-lg border border-amber-300/40 bg-amber-50/40 p-4 dark:border-amber-700/30 dark:bg-amber-950/20">
+              <div key={`${item.kind}:${item.source}`} className="min-w-0 rounded-lg border border-amber-300/40 bg-amber-50/40 p-4 dark:border-amber-700/30 dark:bg-amber-950/20">
                 <div className="flex items-start justify-between gap-3">
                   <div className="min-w-0 space-y-1">
                     <p className="truncate font-mono text-[11px]" title={item.source}>{item.source}</p>