diff --git a/client/src/pages/SharedTripPage.tsx b/client/src/pages/SharedTripPage.tsx index d16cc9df2..153a0a754 100644 --- a/client/src/pages/SharedTripPage.tsx +++ b/client/src/pages/SharedTripPage.tsx @@ -486,17 +486,34 @@ export default function SharedTripPage() { > {di + 1} -
+ {/* `flex: 1` alone gives this block a base size of 0, so the moment an + accommodation chip pushes the row over the available width it freezes + at its min-content width — a ~37px column with one word, or one CJK + character, per line (#1955). Base auto plus minWidth 0 lets it shrink + proportionally and truncate instead. */} +
{day.title || t('dayplan.dayN', { n: day.day_number })}
{day.date && (
{new Date(day.date + 'T00:00:00Z').toLocaleDateString(locale, { weekday: 'short', @@ -512,18 +529,27 @@ export default function SharedTripPage() { key={acc.id} className="bg-[#f3f4f6] text-[#6b7280]" style={{ - fontSize: 'calc(9px * var(--fs-scale-caption, 1))', + fontSize: 'calc(10.5px * var(--fs-scale-caption, 1))', padding: '2px 6px', borderRadius: 4, display: 'flex', alignItems: 'center', - gap: 3, + gap: 4, + minWidth: 0, }} > - {acc.place_name} + + {/* Own span: text-overflow needs a block container, and the chip + itself is a flex container. */} + + {acc.place_name} + ))} - + {dayPlaceCount} {t('shared.places')}