adaedb70ef
Mobile Navigation: - Add MobileNav component with bottom tab bar - Show mobile nav on small screens, hide desktop sidebar - Add session count badge to Sessions tab - Add safe area padding for notched devices Session Management: - Redesign SessionCard for mobile with action menu - Add MobileActionSheet for session actions - Keep primary action prominent Forms & Dialogs: - Stack form fields vertically on mobile - Ensure 44px minimum touch targets - Update dialogs for 320px viewport Responsive Layout: - Add MobilePageHeader with back button - Reduce page padding on mobile - Stack multi-column grids vertically Touch & Interaction: - Add active states to interactive elements - Ensure 8px spacing between touch targets Complex Pages: - Update Repo Workspace for mobile - Update Tool Workshop and Config Profiles Build: TypeScript check passes, production build succeeds
23 lines
965 B
Markdown
23 lines
965 B
Markdown
## ADDED Requirements
|
|
|
|
### Requirement: Mobile Instance Controls
|
|
The system SHALL ensure instance control actions are usable on mobile viewports.
|
|
|
|
#### Scenario: Control button visibility on mobile
|
|
- **GIVEN** an instance card or detail view on mobile
|
|
- **THEN** control buttons (Start, Stop, Restart, Delete) have minimum 44px height
|
|
- **AND** buttons have adequate spacing between them
|
|
- **AND** button labels are readable at mobile font sizes
|
|
|
|
#### Scenario: Instance status display on mobile
|
|
- **GIVEN** an instance on mobile
|
|
- **THEN** the status indicator is clearly visible
|
|
- **AND** status text does not wrap awkwardly
|
|
- **AND** health/probe information is accessible without horizontal scrolling
|
|
|
|
#### Scenario: Instance creation form on mobile
|
|
- **GIVEN** the instance creation flow on mobile
|
|
- **THEN** all configuration fields stack vertically
|
|
- **AND** dropdowns and selects are usable with touch
|
|
- **AND** the submit button is prominent and reachable
|