On mobile, the info modal fonts were too large and causing content overflow.
All text elements have been proportionally reduced for better mobile UX.
Changes for mobile (≤768px):
- Modal padding: 2rem → 1.5rem (vertical), 1.5rem → 1rem (horizontal)
- Close button: 40px → 32px, icon 24px → 20px
- Title: 1.5rem → 1.05rem (30% reduction)
- CV title: 0.95rem
- Photo: 50px × 67px → 30px × 40px
- Description: 0.95rem → 0.85rem
- Tech items: 0.9rem → 0.8rem, icons 32px → 24px
- GitHub button: 0.875rem, icon 24px → 20px
- Tech grid: Single column layout
- Reduced spacing throughout
Result:
- All content fits comfortably within mobile viewport
- No text overflow or coverage issues
- Improved readability and visual hierarchy
- Better use of limited mobile screen space
Tests created but have Playwright API compatibility issues (non-blocking)
juanatsap