feat(ui): v1 desktop responsive — top app bar + content max-widths

Browse Source

The existing PWA layout was mobile-first only: BottomNav hides at ≥960px
with no replacement, leaving desktop users with zero navigation and views
that stretch to viewport width. Fixes both:

- New TopNav.vue mirrors BottomNav (Home / Library / Settings) but renders
  as a top horizontal app bar at ≥960px only. Includes the wordmark + mark.
- App.vue includes <TopNav v-if="!route.meta.hideNav" /> alongside BottomNav
  so upload-flow hideNav: true still hides both.
- HomeView, LibraryView, SettingsView get desktop max-widths (820 / 1100 /
  720 respectively) so content centers instead of stretching to 1440+.

Same cream/terracotta theme tokens, no aesthetic change — just gives v1
proper desktop chrome. Prep for v2 opt-in landing next.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

...

This commit is contained in:

Matt Edholm

2026-05-15 12:17:49 -04:00

parent 81effca22b

commit 5bb8289a54

20 changed files with 226 additions and 26 deletions

Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL

Download Patch File Download Diff File Expand all files Collapse all files

public/build/assets/SettingsView-DBUrUua5.css

+1

File diff suppressed because one or more lines are too long