fix(planner): steady satellite pill, responsive places rail, day-scoped add

The satellite toggle sat on an offset that included --day-panel-h, so it hopped
every time the day panel was collapsed or expanded. On the desktop map that
panel is a centred card between the sidebars and never reaches the pill at the
left edge, so the lift only applies on a phone now.

In the places rail the two add buttons split the width evenly once a day is
open, and every button drops to its icon when the rail is dragged narrow. The
filter tabs span the rail and keep their own text widths. The count is a badge
across the rail; the search field got the outline the controls around it use.

An empty day offers a button that opens the place form pointed at that day
instead of only stating that nothing is planned. The day is cleared again when
the form is opened to edit, which it was not before.

The trip tab bar no longer carries a native title repeating its own label; the
full name moved to aria-label for the tabs whose label is abbreviated.

Three maps tests drove the index switch through app_settings, which no longer
holds it, and now move TREK_PLACES_ENABLED instead.
This commit is contained in:
Maurice
2026-09-08 19:43:11 +02:00
committed by Maurice
parent 9fa0ceaf49
commit f5d6af9c77
34 changed files with 229 additions and 66 deletions
+6 -1
View File
@@ -937,7 +937,12 @@ export const MapView = memo(function MapView({
// Store flips state synchronously (instant, works offline); a failed save is logged there.
updateSetting('map_base_layer', isSatellite ? 'default' : 'satellite').catch(() => {})
}, [isSatellite, updateSetting])
const switcherBottom = hasDayDetail
// The day panel is a centred card between the two sidebars, so on the desktop
// map it never reaches this pill sitting hard against the left sidebar. Lifting
// it by the panel height only made it hop on every collapse and expand, since
// --day-panel-h changes while hasDayDetail stays true. On a phone the panel is
// full width and does cover the pill, so the lift stays there.
const switcherBottom = isMobile && hasDayDetail
? 'calc(var(--bottom-nav-h, 0px) + 20px + var(--day-panel-h, 0px) + 12px)'
: 'calc(var(--bottom-nav-h, 0px) + 12px)'