helios/heliosian
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add PWA notes, mobile browse mode, mobile layout docs

Browse Source
This commit is contained in:
Ian Gulliver
2026-08-15 14:48:50 -07:00
parent 2123603bc1
commit 2406715b18
5 changed files with 38 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/design.md
+7
View File
@@ -66,3 +66,10 @@ Original tile art (1254×1254 JPEGs for all nine classrooms and all nine grade t
- List rows with right chevrons; hairline dividers; generous whitespace.
- Detail pages break the white page with a full-width deep-teal band for family content.
- Inline separators: "▶" chains grade to team to subteam; "·" dots separate contact fragments.
## Responsive chrome
- Phones are the primary target; the desktop layout is the adaptation, not the other way around.
- Narrow screens replace the sidebar with a brand-teal top bar (hamburger, page title, or back arrow + record name) and a bottom tab bar of icon-and-label items for the everyday sections.
- Content keeps one structure across widths: grids go from multi-column to two columns, detail blocks stack full-width, and the teal family band spans edge to edge.
- The status-bar area is part of the brand chrome (`viewport-fit=cover`, translucent status bar over teal — see `docs/pwa.md`).