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
1.0 KiB
1.0 KiB
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