Skip to content

fix: make landing page fully responsive for mobile - #109

Open
rafaio1 wants to merge 1 commit into
iii123iii:mainfrom
rafaio1:main
Open

fix: make landing page fully responsive for mobile#109
rafaio1 wants to merge 1 commit into
iii123iii:mainfrom
rafaio1:main

Conversation

@rafaio1

@rafaio1 rafaio1 commented Aug 30, 2026

Copy link
Copy Markdown

Summary

Makes the Crystal-PDF landing page fully responsive across all mobile viewports.

Changes

  • Hero section: Stacks vertically on mobile with centered text and buttons; shows a scaled-down crystal prism visual (220px) instead of hiding it entirely
  • Tools grid: Responsive columns (2 → 3 → 4) with adjusted padding and card sizing
  • How it works: Reduced padding on mobile, smaller step icons, tighter gaps
  • CTA section: Buttons stack vertically on small screens, horizontal on sm+
  • Footer: Reorders brand/text vertically on mobile for readability
  • Section headers: Centered on mobile, left-aligned on desktop

Testing

  • Verified layout at 320px, 375px, 768px, 1024px, and 1440px widths
  • No horizontal overflow at any breakpoint
  • All interactive elements remain tappable (min 44px touch targets)

Resolves #3

- Stack hero section vertically on mobile with centered text/buttons
- Show scaled-down crystal prism visual on mobile viewports
- Adjust tools grid to 2/3/4 columns across breakpoints
- Reduce padding and font sizes for small screens
- Stack CTA buttons vertically on mobile
- Reorder footer elements for mobile readability
- Center section headers on mobile, left-align on desktop

Resolves iii123iii#3
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.

Bug bounty 100 usd to whoever makes my landing page responsive for mobile

1 participant