feat: Enhance mobile chat experience with responsive design and navigation

- Implement mobile-first design for the chat interface, optimizing touch interactions and navigation.
- Introduce a peer list view that displays only peers until a selection is made, followed by a full-width chat view.
- Add a back button for easy navigation and ensure touch-friendly elements for better usability.
- Optimize message bubbles and avatars for mobile readability and visibility.
- Update documentation to reflect new mobile-responsive features and navigation improvements.
This commit is contained in:
padreug 2025-08-05 20:47:12 +02:00
parent 37642ca48c
commit 87663d1d87
2 changed files with 162 additions and 13 deletions

View file

@ -99,7 +99,17 @@ Response:
- Message timestamps
- Auto-scroll to latest messages
### 4. Navigation Features
### 4. Mobile-Responsive Design
- **Mobile-first approach**: Optimized for touch interactions
- **Peer list view**: Shows only peers list on mobile until a peer is selected
- **Full-width chat view**: When a peer is selected, switches to full-width chat
- **Back button**: Easy navigation back to peers list
- **Touch-friendly**: Larger touch targets and proper touch feedback
- **Responsive avatars**: Larger avatars on mobile for better visibility
- **Message bubbles**: Optimized width (75% max) for mobile readability
- **Keyboard-friendly**: Input stays visible when keyboard appears
### 5. Navigation Features
- Integrated into main navigation menu
- Message icon for easy identification
- Multi-language support