Kpa-clawbot 59d664692d fix(#1630): reach page — narrow-viewport CSS (no h-scroll, shrunken map) (#1634) ...

Red commit: 03546923b4 (CI run: pending —
see Checks)

E2E assertion added: test-issue-1630-reach-mobile-e2e.js:97

## Summary

Adds narrow-viewport CSS to `public/node-reach.css` so the
`/nodes/{pubkey}/reach` page no longer overflows phone-class viewports.

Fixes #1630

## Approach (red → green)

1. **RED** (`03546923`): added `test-issue-1630-reach-mobile-e2e.js`
asserting at 393×800 and 360×740 that:
   - `#nqMap` computed height ≤ 320px
   - `.nq-table` scrollWidth ≤ clientWidth (no inner h-scroll)
   - ≤ 4 visible TH columns (low-signal collapsed)

Desktop guard at 1440×900: map height stays ~420px and all 6 columns
remain visible — proves no desktop regression.

Wired into `.github/workflows/deploy.yml` Playwright job so CI is the
source of truth.

2. **GREEN**: added `@media (max-width: 480px)` block in
`public/node-reach.css` that shrinks `.nq-map` to 280px, hides the
`distance (km)` column, and stacks `we hear` / `they hear us` into a
single compact column.

## Out of scope (intentionally not touched)

- Backend `cmd/server/node_reach.go` (tracked in #1631 / #1629).
- Reach page re-theming.
- Per-column user toggles.

## Local verification

Screenshots at the three target viewports (393×800, 360×740, 1440×900)
attached below.

---------

Co-authored-by: openclaw-bot <bot@openclaw.local>

2026-06-09 03:16:59 -07:00

..

agents

chore: normalize all files to LF line endings

2026-03-30 22:52:46 -07:00

instructions

chore: normalize all files to LF line endings

2026-03-30 22:52:46 -07:00

workflows

fix(#1630): reach page — narrow-viewport CSS (no h-scroll, shrunken map) (#1634)

2026-06-09 03:16:59 -07:00