mirror of
https://github.com/mauriceboe/TREK.git
synced 2026-10-21 06:26:26 +00:00
fix(client): a phone turned sideways stays in the phone layout
The phone shell was chosen by width alone, and most phones are wider than 767px in landscape, so turning one swapped the whole route tree for the desktop planner and an open sheet, its input and the map position were lost. The phone query now also covers a touch screen under 500px tall, which no tablet is. It lives in one place: the shell, the planner and todo hooks, the warnings banner, dialog focus and the stylesheets read it, and six components that measured the window once on mount now follow it.
This commit is contained in:
@@ -2323,12 +2323,11 @@ export function MapViewGL({
|
||||
|
||||
// Fit bounds on fitKey change — matches the Leaflet BoundsController
|
||||
const paddingOpts = useMemo(() => {
|
||||
const isMobile = typeof window !== 'undefined' && window.innerWidth < 768
|
||||
if (isMobile) return { top: 40, right: 20, bottom: 40, left: 20 }
|
||||
const top = 60
|
||||
const bottom = hasInspector ? 320 : hasDayDetail ? 280 : 60
|
||||
return { top, right: rightWidth + 40, bottom, left: leftWidth + 40 }
|
||||
}, [leftWidth, rightWidth, hasInspector, hasDayDetail])
|
||||
}, [isMobile, leftWidth, rightWidth, hasInspector, hasDayDetail])
|
||||
|
||||
const prevFitKey = useRef<number | null>(-1)
|
||||
const pendingRouteFitRef = useRef<{ fitKey: number | null; routeKey: string } | null>(null)
|
||||
|
||||
Reference in New Issue
Block a user