From 761ffa85d96daac53e69bf5aa716fe8a1248b817 Mon Sep 17 00:00:00 2001
From: Jack Levy <YOUR_GITEA_NOREPLY_EMAIL_HERE>
Date: Sun, 15 Mar 2026 19:58:34 -0400
Subject: [PATCH] fix: prevent horizontal overflow in notification history rows
 on mobile

Add overflow-hidden to EventRow containers and break-words to brief summary
to prevent long unbreakable text from widening the viewport and causing zoom.
Also switch h-screen to h-dvh for correct mobile viewport height.

Authored by: Jack Levy
---
 frontend/app/notifications/page.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/app/notifications/page.tsx b/frontend/app/notifications/page.tsx
index c9be3ae..259b5ba 100644
--- a/frontend/app/notifications/page.tsx
+++ b/frontend/app/notifications/page.tsx
@@ -1048,9 +1048,9 @@ export default function NotificationsPage() {
           const billTitle = p.bill_title as string | undefined;
           const briefSummary = p.brief_summary as string | undefined;
           return (
-            <div className="flex items-start gap-3 py-3">
+            <div className="flex items-start gap-3 py-3 overflow-hidden">
               <Icon className={`w-4 h-4 mt-0.5 shrink-0 ${meta.color}`} />
-              <div className="flex-1 min-w-0">
+              <div className="flex-1 min-w-0 overflow-hidden">
                 <div className="flex items-center gap-2 flex-wrap">
                   <span className="text-xs font-medium">{meta.label}</span>
                   {billLabel && (
@@ -1085,7 +1085,7 @@ export default function NotificationsPage() {
                   ) : null;
                 })()}
                 {briefSummary && (
-                  <p className="text-xs text-muted-foreground mt-0.5 line-clamp-2">{briefSummary}</p>
+                  <p className="text-xs text-muted-foreground mt-0.5 line-clamp-2 break-words">{briefSummary}</p>
                 )}
               </div>
               {showDispatch && (