From 284e625fd54570939945de1b3b9a2ab0c239448e Mon Sep 17 00:00:00 2001
From: Ariel Costas Guerrero <ariel@costas.dev>
Date: Mon, 1 Dec 2025 22:42:06 +0100
Subject: fix: adjust width of LineIcon container and improve marquee display
 logic

---
 .../components/Stops/ConsolidatedCirculationCard.tsx  | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

(limited to 'src/frontend/app/components/Stops/ConsolidatedCirculationCard.tsx')

diff --git a/src/frontend/app/components/Stops/ConsolidatedCirculationCard.tsx b/src/frontend/app/components/Stops/ConsolidatedCirculationCard.tsx
index 8f43939..8a2eb94 100644
--- a/src/frontend/app/components/Stops/ConsolidatedCirculationCard.tsx
+++ b/src/frontend/app/components/Stops/ConsolidatedCirculationCard.tsx
@@ -194,7 +194,7 @@ export const ConsolidatedCirculationCard: React.FC<
         `.trim()}
         {...interactiveProps}
       >
-        <div className="shrink-0">
+        <div className="shrink-0 w-[7ch]">
           <LineIcon line={estimate.line} mode="pill" />
         </div>
         <div className="flex-1 min-w-0 flex flex-col gap-1">
@@ -273,13 +273,16 @@ export const ConsolidatedCirculationCard: React.FC<
           </div>
           <div className="route-info">
             <strong>{estimate.route}</strong>
-            {estimate.nextStreets && estimate.nextStreets.length > 0 && (
-              <Marquee speed={85}>
-                <div className="mr-32 font-mono">
-                  {estimate.nextStreets.join(" — ")}
-                </div>
-              </Marquee>
-            )}
+            {estimate.nextStreets && estimate.nextStreets.length > 0 && (() => {
+              const text = estimate.nextStreets.join(" — ");
+              return (
+                <Marquee speed={85} play={text.length > 30}>
+                  <div className="mr-32 font-mono">
+                    {text}
+                  </div>
+                </Marquee>
+              );
+            })()}
           </div>
           {hasGpsPosition && (
             <div className="gps-indicator" title="Live GPS tracking">
-- 
cgit v1.3

