Ullrich Schäfer
|
c38e054088
|
feat(planner): restyle elevation chart canvas on tokens
Bring the chart's chrome onto the design system (spec task 5.1):
- Plain mode: sage accent line + soft accent→transparent gradient fill
(was off-palette blue).
- Hover: calm near-black crosshair + accent dot with a light ring, mono
label (was red).
- Axis + day-divider labels: token colors, Geist Mono; dividers use the
border-md token.
- Drag-select: accent tint (was blue).
Per-mode data-viz palettes (grade, surface, …) are unchanged. Darwin
visual-regression baselines regenerated; linux baselines to follow via
the update-snapshots workflow.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
|
2026-07-16 01:20:36 +02:00 |
|
Ullrich Schäfer
|
34529a9432
|
Split ElevationChart + PlannerMap into deep modules; add visual regression testing
ElevationChart (1013 lines) split into:
- elevation-chart-draw.ts — pure drawElevationChart(ctx, w, h, params) function
- use-elevation-data.ts — useElevationData(routeData) hook
- ElevationChart.tsx — ~300 lines, interaction + render only
PlannerMap (869 lines) split into:
- MapHelpers.tsx — 7 Leaflet sub-components (MapExposer, RouteFitter, MapClickHandler,
CursorTracker, NoGoAreaButton, OverlaySync, PoiRefresher)
- use-waypoint-manager.ts — all waypoint CRUD + route data sync
- use-gpx-drop.ts — GPX drag-and-drop hook
- PlannerMap.tsx — ~200 lines, orchestration only
Add Vitest browser visual regression tests for drawElevationChart via
@vitest/browser + Playwright (toMatchScreenshot). Tests cover plain, grade,
elevation, surface color modes plus hover and drag-select states.
Add update-visual-snapshots.yml workflow: triggered by workflow_dispatch or
the `update-snapshots` PR label; commits snapshots back to the branch.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
|
2026-05-10 16:41:23 +02:00 |
|