e8d5b16acc
- Add mobile viewport detection to ToolWorkshopPage - Implement mobile list view with MobileListView component - Implement mobile detail view with MobileDetailView component - Implement mobile edit view with MobileEditView component - Add MobileFAB for creating new tool types - Fix IconName type issues in mobile components - TypeScript check passes, build succeeds
2.0 KiB
2.0 KiB
1. Mobile Navigation Updates
- 1.1 Add "Tools" grouped item to MobileNav component with bottom sheet
- 1.2 Create ToolsBottomSheet component for Tool Workshop / Config Profiles selection
- 1.3 Update AppShell desktop nav to keep Tool Workshop and Config Profiles separate
- 1.4 Add active state logic for grouped nav items
2. Mobile List-Detail Components
- 2.1 Create MobileListView component for displaying item cards
- 2.2 Create MobileDetailView component for read-only detail display
- 2.3 Create MobileEditView component for full-screen editing
- 2.4 Add swipe-to-delete and action sheet to MobileListView
- 2.5 Create FAB (Floating Action Button) component for creating items
3. Mobile Tool Workshop
- 3.1 Add mobile list view for tool types
- 3.2 Add mobile detail view for tool types (read-only)
- 3.3 Add mobile edit view for tool types
- 3.4 Add mobile create view for tool types
- 3.5 Implement list→detail navigation in ToolWorkshopPage
4. Mobile Config Profiles
- 4.1 Add mobile list view for config profiles
- 4.2 Add mobile detail view for config profiles (read-only)
- 4.3 Add mobile edit view for config profiles
- 4.4 Add mobile create view for config profiles
- 4.5 Implement list→detail navigation in ConfigProfilesPage
5. Mobile Repo Workspace
- 5.1 Create MobileFileTree component with folder expansion
- 5.2 Create MobileEditorView component for full-screen editing
- 5.3 Create MobileGitView component for git operations
- 5.4 Create MobileTerminalView component for terminal access
- 5.5 Add bottom tab navigation to RepoWorkspace (Tree, Editor, Git, Terminal)
- 5.6 Implement repository and branch selectors for mobile
6. Testing & Polish
- 6.1 Test mobile navigation on iPhone SE (320px)
- 6.2 Test mobile navigation on iPhone standard (375px)
- 6.3 Verify desktop layouts remain unchanged
- 6.4 Run npm run typecheck
- 6.5 Run npm run lint
- 6.6 Run npm run build
- 6.7 Test swipe gestures and touch targets