mirror of
https://github.com/Kpa-clawbot/meshcore-analyzer.git
synced 2026-05-12 16:54:43 +00:00
Kpa-clawbot
440bda6244
## Summary Fixes the channel color picker UX issues on both Live page and Channels page. Closes #681 ## Repro Evidence (on master at HEAD) - **Live feed dots**: 12px inline — too small to reliably click in a fast-moving feed - **Right-click hijack**: `contextmenu` listener on live feed conflicts with browser context menu - **Channels page**: No way to clear an assigned color without opening the picker popover - **Popover positioning**: 8px edge margin causes overlap with panel borders ## Root Cause | Issue | File:Line | |-------|-----------| | Tiny dots | `public/live.js:2847` — inline `width:12px;height:12px` | | Context menu hijack | `public/channel-color-picker.js:231` — `feed.addEventListener('contextmenu', ...)` | | No clear affordance | `public/channels.js:1101` — dot rendered without adjacent clear button | | Popover overlap | `public/channel-color-picker.js:108-109` — `vw - pw - 8` margin | ## Fix 1. Increased feed color dots to 18px (visible, clickable) 2. Removed contextmenu listener from live feed — dots are the interaction point 3. Added inline `✕` clear button next to colored dots on channels page 4. Increased popover edge margin to 14px ## TDD Evidence - **Red commit:** `2034071` — 6/8 tests fail (dot size, contextmenu, clear affordance, margins) - **Green commit:** `49636e5` — all 8 tests pass ## Verification - `node test-color-picker-ux.js` — 8/8 pass - `node test-channel-color-picker.js` — 17/17 pass (existing tests unbroken) --------- Co-authored-by: you <you@example.com>
