Skip to content

Responsive layout for mobile widths - #82

Merged
Damans227 merged 2 commits into
mainfrom
feat/31-mobile-responsiveness
Sep 25, 2026
Merged

Damans227 merged 2 commits into
mainfrom
feat/31-mobile-responsiveness

Conversation

@elenav24

Copy link
Copy Markdown
Member

Closes #31
Fixes mobile input zoom and horizontal overflow. All other requirements from the issue were already implemented in #67

Changes

  • Prevented iOS auto-zoom on input focus by increasing input/textarea font-size to 16px (below 16px triggers Safari's auto-zoom-on-focus, which wasn't reliably reverting)
  • Added maximum-scale=1 to the viewport meta tag as a backstop against zoom
  • Disabled horizontal scrolling on the page/container to fix overflow on mobile

Testing

  • Verified on mobile Safari that tapping the text input no longer triggers zoom and that the sidebar opens and closes
  • Confirmed no horizontal scroll/overflow on small viewport widths of 360 px - 768 px

@elenav24
elenav24 requested a review from Damans227 September 25, 2026 13:59

@Damans227 Damans227 left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks good, approving. optional: put the 16px on the message box instead of the button so pinch-zoom still works.

@Damans227
Damans227 merged commit f20529e into main Sep 25, 2026
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Responsive layout for mobile widths

2 participants