mattermost
[UI IMPROVEMENT]: Back icon overlaps with header text on small screens when keyboard is open (Signup screen)
Description: On smaller devices (e.g., 1280×576 resolution), after completing first-time onboarding, when the keyboard opens on the “Connect to a Server” screen (for example, when entering Server URL or Display Name), the back icon/logo overlaps or hides behind the “to a Server” title text, making it difficult to see or tap.
Steps to Reproduce:
- Complete the first-time onboarding flow.
- Navigate to the Connect to a Server screen.
- Tap any text input to open the keyboard.
- Observe the back icon — it overlaps or is partially hidden by the title text.
Expected Behavior: The back icon should remain clearly visible and tappable at all times.
Screenshot
Proposed Solution: Conditionally adjust the position of the back icon when the keyboard is visible, e.g.:
- Move it to the right (or add padding)
- Or reduce the title text margin when the keyboard opens
Environment:
- Mattermost Mobile App version: [2.33.1]
- Platform: Android
- Screen resolution: 1280×576
Hi, I’d like to work on this issue. Could you please assign it to me? I plan to implement a fix that adjusts the back icon position or the title margin when the keyboard is open to prevent overlap on smaller devices.
Hi team 👋 — I'd like to claim this UI overlap bug (#9237). I have 4.8 years of React Native experience and my current focus is on long-term stability fixes like this. I will reproduce the issue on small screens and propose a fix for the back icon positioning when the keyboard is open.
Please assign it to me if it's still available. Thank you!
@nihar777, the issue is currently assigned to @PrajwalK44, so we should wait a bit to give time to complete
