- Card-based mobile-first UI for non-technical users
- Room cards showing occupancy count, person names, and status color
- Activity feed with chronological event list from timeline
- Alert banner for fall detection, anomaly alerts, and system warnings
- Quick actions: arm/disarm security, re-baseline, silence alerts
- Sleep summary card showing last night's sleep data
- Toggle between simple/expert mode with localStorage preference
- Added /simple route in mothership for serving simple mode page
- Added purple color scale to tokens.css for sleep features
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Implements the full explainability overlay for understanding why a blob was detected:
- ExplainabilitySnapshot generation with per-link contribution tracking and zone decay
- Fresnel zone ellipsoid geometry computation and 3D wireframe rendering
- WebSocket request_explain / blob_explain flow for on-demand snapshots
- Right-click, long-press, click, and hover tooltip activation paths
- X-ray overlay dims non-contributing elements, highlights contributing links
- Sidebar panel with confidence gauge, links table, sparklines, BLE match card
- Escape key and backdrop click to exit, restoring scene state
Also includes: simple mode removal, CSS cleanup, fleet page enhancements, sidebar timeline fixes.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Fix systemic missing-colon bugs in layout.css where property values
like top, left, right, bottom, gap, padding were directly followed by
var() without a colon separator. This broke all fixed-position panels
in the live view. Also add missing --space-half token to tokens.css
and complete design token migration across remaining CSS files.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Replace remaining hard-coded colors across all CSS files with design
tokens from tokens.css. Remove duplicate inline positioning from
live.html panels (now in layout.css). Add replay session blob fetch
for immediate 3D scene state on seek.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Home page (index.html) is now a clean status+cards layout (109 lines):
- Row 1: status headline with ok/warn/alert states
- Row 2: three cards linking to /live#zones, /fleet, /live#timeline
- Row 3: optional briefing, anomaly, security toggle
- Mobile bottom nav for Home/Live/Fleet/Setup
3D viewer lives at /live (live.html), fleet at /fleet, setup at /setup.
All routes served by Go chi router. home-cards.js connects to /ws/dashboard
for snapshot+incremental updates.
Remaining CSS tokenization: live.html buttons and layout.css status bar
now use design tokens instead of hardcoded colors. Added --orange token
for GDOP fair quality. timeline.js gains replay state fields.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Convert hardcoded rgba colors across all dashboard CSS files to use
--ok-bg, --warn-bg, --alert-bg tokens from tokens.css per §8e design
system. Home page status banner and card tags now use proper semantic
tokens. Add layout.css import to live.html for shared nav structure.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Per plan.md §8e information architecture:
- index.html (109 lines) is now a home page with status headline,
3 cards (People & Zones, Devices & Fleet Health, Recent Events),
optional extras row, and mobile bottom nav
- live.html serves the full 3D viewer at /live route
- home-cards.js connects to /ws/dashboard for snapshot + incremental updates
- tokens.css provides the Radix dark design system
- layout.css provides the CSS Grid app shell with responsive breakpoints
- home.css provides card grid, status banner, responsive mobile layout
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
