Fusion
b6bda3d692
- Add mobile viewport detection hook - Add virtual keyboard detection with fallback - Add auto-hide hook for header/keys strip - Add special keys mapping hook - Create MobileTerminalHeader, SpecialKeysStrip, SpecialKeysPanel components - Create MobileTerminalWrapper component - Update TerminalComponent with mobile support, font scaling, copy/paste, reconnection - Update AppShell to hide chrome on mobile terminal pages - Update TerminalPage to use MobileTerminalWrapper - Add comprehensive mobile terminal styles - TypeScript check passes - Build succeeds
24 lines
1.0 KiB
Markdown
24 lines
1.0 KiB
Markdown
## MODIFIED Requirements
|
|
|
|
### Requirement: Layout Component
|
|
|
|
The system SHALL provide a consistent application layout for authenticated screens across desktop and mobile sizes.
|
|
|
|
#### Scenario: Application shell
|
|
- **GIVEN** the frontend application
|
|
- **THEN** a Layout component SHALL:
|
|
- Display a header with user info and logout
|
|
- Display sidebar navigation on desktop
|
|
- Show main content area
|
|
- Collapse sidebar into a mobile menu toggle on small viewports
|
|
- **AND** on mobile terminal pages, provide a minimal collapsible header instead of the full AppShell
|
|
|
|
#### Scenario: Terminal page mobile layout
|
|
- **GIVEN** a user on a terminal page on a mobile device
|
|
- **WHEN** the page loads
|
|
- **THEN** the full AppShell is replaced with a minimal header
|
|
- **AND** the header contains: back button, menu toggle, instance name, close button
|
|
- **AND** the header auto-hides after 3 seconds of inactivity
|
|
- **AND** tapping the terminal area toggles header visibility
|
|
- **AND** the sidebar navigation is accessible via the menu toggle
|