Add responsive mobile layout for the app shell and board #6

brianfertig · 2026-08-30T04:43:05Z

brianfertig commented

2026-08-30 04:43:05 +00:00

Replace the fixed min-width horizontal-scroll shell with a stacked
mobile layout (h-dvh) that keeps the desktop three-column layout at md+
Add MobileTopBar with hamburger menu, brand, and theme toggle reachable
without opening the drawer
Convert SideNav into shared content plus a left-sheet hamburger drawer;
close on navigation link tap, backdrop, or Escape
Make the board swipeable on mobile: one lane per screen via snap paging,
with a CategoryChips rail that tracks the active lane (IntersectionObserver)
and glides to it on tap; lanes go full-width below md
Turn the Scheduled panel into a bottom dock bar + bottom sheet on mobile
(keeps overdue/today urgency badges), desktop aside unchanged at md+
Compact board chrome for phones: icon-only Summary/View buttons, smaller
title/padding, full-width AddCategoryLane as a snap page under empty state
Allow tall dialogs to scroll within dvh so edit forms and the AI summary
stay usable on small screens; make admin user table horizontally scrollable
Support configurable ThemeToggle menu side/align so it opens downward in
the mobile top bar instead of off-screen
Add CDP-based screenshot script and reference shots for mobile/tablet/desktop

- Replace the fixed min-width horizontal-scroll shell with a stacked mobile layout (h-dvh) that keeps the desktop three-column layout at md+ - Add MobileTopBar with hamburger menu, brand, and theme toggle reachable without opening the drawer - Convert SideNav into shared content plus a left-sheet hamburger drawer; close on navigation link tap, backdrop, or Escape - Make the board swipeable on mobile: one lane per screen via snap paging, with a CategoryChips rail that tracks the active lane (IntersectionObserver) and glides to it on tap; lanes go full-width below md - Turn the Scheduled panel into a bottom dock bar + bottom sheet on mobile (keeps overdue/today urgency badges), desktop aside unchanged at md+ - Compact board chrome for phones: icon-only Summary/View buttons, smaller title/padding, full-width AddCategoryLane as a snap page under empty state - Allow tall dialogs to scroll within dvh so edit forms and the AI summary stay usable on small screens; make admin user table horizontally scrollable - Support configurable ThemeToggle menu side/align so it opens downward in the mobile top bar instead of off-screen - Add CDP-based screenshot script and reference shots for mobile/tablet/desktop

brianfertig added 1 commit 2026-08-30 04:43:06 +00:00

f21b12182c Add responsive mobile layout for the app shell and board

- Replace the fixed min-width horizontal-scroll shell with a stacked
  mobile layout (h-dvh) that keeps the desktop three-column layout at md+
- Add MobileTopBar with hamburger menu, brand, and theme toggle reachable
  without opening the drawer
- Convert SideNav into shared content plus a left-sheet hamburger drawer;
  close on navigation link tap, backdrop, or Escape
- Make the board swipeable on mobile: one lane per screen via snap paging,
  with a CategoryChips rail that tracks the active lane (IntersectionObserver)
  and glides to it on tap; lanes go full-width below md
- Turn the Scheduled panel into a bottom dock bar + bottom sheet on mobile
  (keeps overdue/today urgency badges), desktop aside unchanged at md+
- Compact board chrome for phones: icon-only Summary/View buttons, smaller
  title/padding, full-width AddCategoryLane as a snap page under empty state
- Allow tall dialogs to scroll within dvh so edit forms and the AI summary
  stay usable on small screens; make admin user table horizontally scrollable
- Support configurable ThemeToggle menu side/align so it opens downward in
  the mobile top bar instead of off-screen
- Add CDP-based screenshot script and reference shots for mobile/tablet/desktop

brianfertig merged commit 25f5c4240e into main

2026-08-30 04:43:16 +00:00

brianfertig referenced this issue from a commit

2026-08-30 04:43:18 +00:00

Merge pull request 'Add responsive mobile layout for the app shell and board' (#6) from Mobile into main

Sign in to join this conversation.

No reviewers

No Label

No Milestone

No project

No Assignees

1 Participants

Notifications

Due Date

The due date is invalid or out of range. Please use the format 'yyyy-mm-dd'.

No due date set.

Dependencies

No dependencies set.

Reference: brianfertig/Organize#6