diff --git a/tradein-mvp/frontend/src/components/trade-in/HouseAnalyticsSection.tsx b/tradein-mvp/frontend/src/components/trade-in/HouseAnalyticsSection.tsx index 5ee1f808..decb019d 100644 --- a/tradein-mvp/frontend/src/components/trade-in/HouseAnalyticsSection.tsx +++ b/tradein-mvp/frontend/src/components/trade-in/HouseAnalyticsSection.tsx @@ -15,7 +15,7 @@ export function HouseAnalyticsSection({ estimateId }: Props) { if (data.kpi.total_lots === 0) return null; return ( -
+
-
+
diff --git a/tradein-mvp/frontend/src/components/trade-in/RecentSoldList.tsx b/tradein-mvp/frontend/src/components/trade-in/RecentSoldList.tsx index e2c881cc..dae2cdf2 100644 --- a/tradein-mvp/frontend/src/components/trade-in/RecentSoldList.tsx +++ b/tradein-mvp/frontend/src/components/trade-in/RecentSoldList.tsx @@ -28,7 +28,7 @@ export function RecentSoldList({ items }: Props) { {items.length} лот{suffix} -
+
diff --git a/tradein-mvp/frontend/src/components/trade-in/trade-in.css b/tradein-mvp/frontend/src/components/trade-in/trade-in.css index 19491cb2..ff0da9a1 100644 --- a/tradein-mvp/frontend/src/components/trade-in/trade-in.css +++ b/tradein-mvp/frontend/src/components/trade-in/trade-in.css @@ -2215,3 +2215,42 @@ .whatif-row { grid-template-columns: 1fr; } } @keyframes ti-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } + +/* ============================================================ + #692 — Mobile horizontal-overflow guard (≤390px) + Root causes: recharts ResponsiveContainer / Leaflet tiles / + wide comp-tables / top-nav, все push width когда flex/grid + ребёнок имеет дефолтный min-width:auto и не может ужаться. + Эти правила desktop-neutral: на ≥1100px ничего не меняют + (layout уже single-col и контент влезает), только страхуют + узкие вьюпорты от бокового скролла страницы. + ============================================================ */ + +/* Последняя линия обороны: страница никогда не скроллится вбок. + clip (не hidden) — не создаёт scroll-container, не ломает sticky. */ +html, body { overflow-x: clip; } +.page { max-width: 100%; overflow-x: clip; } + +/* Каждая прямая карточка/секция результат-колонки должна уметь + ужиматься (flex-ребёнок по умолчанию min-width:auto). .result-col + уже min-width:0; добавляем то же его детям + клип переполнения. */ +.result-col > * { min-width: 0; max-width: 100%; } + +/* Recharts: контейнер графика всегда 100% ширины родителя и + не шире её — ResponsiveContainer мерит этот box. */ +.recharts-responsive-container, +.recharts-wrapper { max-width: 100%; } + +/* Leaflet-обёртка карты (MapCard) — не даём тайлам растянуть карточку. */ +.card > [aria-label="Карта аналогов и сделок"] { max-width: 100%; } + +/* Comp/analog-таблицы со «склейкой» listing-ячейки шире остального: + на узких вьюпортах горизонтальный скролл ВНУТРИ карточки, не страницы. */ +.card > table.dt, +.card > table.offer-tbl { max-width: 100%; } + +@media (max-width: 720px) { + /* Topbar: nav переносится и не выпирает за ширину бара. */ + .top-nav { flex-wrap: wrap; min-width: 0; margin-left: auto; } + .topbar-inner { max-width: 100%; } +}