dilly/samplez
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refresh the Flutter snapshot: UI-01 through UI-09, plus a fresh installable APK

Browse Source 
Full UI redesign pass complete: persistent tab shell with an always-visible
background map, Modern Professional Dark theme, monochrome dark map tiles,
offline skeleton map, a shared GlassPanel/FloatingPill component kit,
customizable HUD telemetry widgets, and the Map HUD / Plan & Route Planning /
Rides History screen rebuilds. 374 tests passing, up from 316.

The APK is a fresh release build (debug-signed, no release signing config
exists yet).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_012Xki7YAcc2TiN2PRZJ2tXr
This commit is contained in:
uhryniuk
2026-08-24 14:41:35 -05:00
parent 4c634354bd
commit 587f75eab4
42 changed files with 4401 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
rippr-flutter-src/docs/design/stitch-export/README.md Normal file
View File

@@ -0,0 +1,62 @@
# Stitch export — Rippr Minimalist Activity Tracker
Pulled from [stitch.withgoogle.com](https://stitch.withgoogle.com) project
`8187200995279352789` via the Stitch MCP server on 2026-08-23.
## Correction
An earlier version of this README got the design systems backwards. There are **three**
distinct design systems in this project (`list_design_systems`), and the four screens
below actually render with the one this doc originally called "stale." That's now fixed.
| Asset | Display name | Mode | Primary | Fonts | Used by the 4 screens below? |
|---|---|---|---|---|---|
| `assets/e73325c5365a4a56b93823236777e95a` | **Modern Professional Dark** | Dark | Blue `#1978e5` (rendered `#4090fe`/`#aac7ff`) | Inter (everywhere) | **Yes — confirmed by hex-matching the downloaded HTML** |
| `assets/41670631a4b64b118fb9ea1b54f1bd60` | Rippr (neon HUD) | Dark | Electric green `#00FF41` | Sora / Inter / JetBrains Mono | No |
| `assets/3938003907261369831` | Modern Professional | Light | Blue `#1275e2` | Inter | No |
**The one you specifically asked for** (screen ID
`asset-stub-assets_e73325c5365a4a56b93823236777e95a`, i.e.
`assets/e73325c5365a4a56b93823236777e95a`) is **Modern Professional Dark** — deep
charcoal/navy (`#0a0a0c` base, `#131313` surface, `#16161a` cards), Professional Blue
primary, Inter throughout, 8px rounding, tonal-layer depth (no shadows, lighter surface
= more elevated), and a soft blue glow on elevated/active elements instead of a shadow.
This is `design-system-modern-professional-dark.md` below, and it's the design system
actually used by all four screens already pulled.
`design-system-rippr-neon.md` is kept for reference — it's a real design system in the
project (`get_project`'s top-level `designTheme`, i.e. whatever a brand-new screen would
default to), but it is **not** what any of the four fetched screens render with.
## Contents
| File | What it is |
|---|---|
| `design-system-modern-professional-dark.md` | **The design system actually applied to the four screens below.** Full spec: color tokens, typography, spacing, elevation, shape, components. |
| `design-system-rippr-neon.md` | A second, unused-by-these-screens design system also present in the project (green/cyan HUD aesthetic). Reference only. |
| `screens/export-summary.md` | Stitch's own generated project overview. Its "Design System: Modern Professional Dark" section was correct all along. |
| `screens/map-hud-dark.html` + `.png` | Map HUD - Dark Mode: active-recording map screen, floating telemetry cards (speed, avg speed, distance, time), Pause/Stop controls. |
| `screens/plan-screen-dark.html` + `.png` | Plan Screen - Dark Mode: empty-state route planner, "Tap to drop a pin" prompt. |
| `screens/route-planning-dark.html` + `.png` | Route Planning - Dark Mode: pins dropped, distance/time/pin-count header, dotted route line, Start Route button. |
| `screens/rides-history-dark.html` + `.png` | Rides History - Dark Mode: search bar, unit toggle, ride cards with a mini-map thumbnail, date, distance, time, avg speed. |
Each `.html` is Stitch's generated markup (Tailwind CSS, vanilla JS) for that screen — a
reference for structure and interaction, not something to drop into the Flutter app
as-is.
## Not pulled as a screen/image
"Design System" (`assets_e73325c5365a4a56b93823236777e95a`) is a **design-system asset
instance**, not a regular screen — Stitch's `get_screen` call only works on
`projects/{project}/screens/{screen}` resources and returns `invalid argument` for an
`assets/{id}` resource. There is no separate HTML/screenshot file for it the way there is
for a screen; its full content (structured theme tokens + style-guideline prose) is
fetched via `list_design_systems` instead, and that's what
`design-system-modern-professional-dark.md` is built from.
## Next step
This is raw material, not yet applied to the app. `lib/src/ui/theme.dart`'s current
palette (safety-orange accent, warm near-black ground — see V3-16) is a different
direction from **either** of these Stitch design systems. Reconciling or replacing is a
decision for whoever picks up the actual UI work on this branch.