[ MvM / IMPLEMENTATION PLAN / PHASE 6 ]
Mobile, XR, Accessibility & QA
Mobile layouts, XR/VR patterns, WCAG 2.1 AA, Storybook, QA. Weeks 13–14.
Tasks & Deliverables
- Bottom tab bar, Hamburger drawer, Gesture nav
components/neo/bottom-nav.tsx, drawer.tsx
- ○Touch targets (48px min), Swipe cards, Pull-to-refresh, Bottom sheet
- Mobile layouts, Reduced animation for performance
Tailwind responsive
Output: components/neo/bottom-nav, drawer
§6.1.1 Hamburger Drawer
components/neo/drawer.tsx · left position, overlay, escape to close
PRD §6.1.1 · drawer.tsx
§6.1.2 Touch Targets, Swipe, Pull-to-Refresh, Bottom Sheet
48px min touch targets · Swipe cards · Pull-to-refresh · Bottom sheet (drawer position=bottom)
PRD §6.1.2
Touch targets (48px min)
Swipe card (drag demo)
Delete
Exotic Helmet
5k GLMR · In progress
Pull-to-refresh
Pull to refresh
Content area
Bottom sheet
§6.1.3 Mobile Layouts
Tailwind responsive · sm:grid-cols-2 md:grid-cols-4 · prefers-reduced-motion
PRD §6.1.3
Top bar (375px)
Card 1
Card 2
Card 3
Card 4
sm:grid-cols-2 md:grid-cols-4 · prefers-reduced-motion