feat:Improve landing page visual appeal and mobile responsiveness

[hunain053]

Problem Statement

Hi @SamXop123 ,

I was checking out the SamDev Pulse landing page and noticed the UI feels a bit static. On desktop, the spacing could be tighter to look more modern, and on mobile, some sections (like the hero and cards) don't fit well, with text appearing too large or overflowing.

Proposed Solution

I’d love to help polish this by:

• Improving spacing and typography for a cleaner look.
• Fixing mobile layout issues so it works smoothly on all screens.
• Adding subtle animations to make the page feel more alive.

I’m a GSSoC contributor and would be happy to work on this to make the site look its best. Could you please assign this issue to me?

Alternatives Considered

No response

Additional Context

No response

Domain

None

[DiyaRathod-16]

/assign

[bhavyaxtech]

Hi @hunain053,

I'd like to work on this issue under GSSoC 2026.

I can improve the landing page's visual appeal by refining spacing and typography, fixing mobile responsiveness issues, and adding subtle animations while keeping the design consistent and performant.

Could you please assign this issue to me?

Also, if my PR gets merged, will it receive the GSSoC-approved label automatically, or is there a separate process for that?

Thank you!

[SamXop123]

@hunain053 thanks for raising this!

before assignment, could you share a few screenshots/mockups highlighting the specific spacing, typography, and mobile responsiveness improvements you have in mind? i'd like to review the direction first and keep the changes focused on polish and usability rather than a broader redesign.

[hunain053]

@hunain053 thanks for raising this!

before assignment, could you share a few screenshots/mockups highlighting the specific spacing, typography, and mobile responsiveness improvements you have in mind? i'd like to review the direction first and keep the changes focused on polish and usability rather than a broader redesign.

Hey @SamXop123, sure! Here's what I found after going through the site on different screen sizes:

• Desktop

1. Features Section: "heading feels a bit too large**

"Powerful Features, Zero Configuration" is noticeably bigger than the card content below it. Bringing it down slightly and tightening the margin above the grid would make the hierarchy feel more balanced.

(Optional: Reduce the size of the headline "samdev-pulse Your GitHub Story,Beautifully Told")

Mobile (iPhone 12 Pro - 390px)

2. Hero badge text wraps into two lines

The "PROJECT UNIFIED LIVE STATS ENGINE" badge splits across two lines on mobile. A smaller font size or a bit less padding inside the badge would keep it on one line and look much cleaner.

3. Stats pills stack vertically

The three pills ("20+ Themes", "Instant", "Real-time") end up stacked one on top of the other, which takes up way too much vertical space. A simple row or 2-column layout would fix this.

4. Feature cards - too much gap between them

The cards are spaced really far apart when stacked on mobile. Just reducing the gap a bit would make the section feel tighter and more professional.

5. Code blocks in Guide section break mid-word

This one's the most noticeable — the code snippets break in the middle of words (like samdev-p on one line and ulse.vercel.app on the next). Adding overflow-x: scroll or word-break handling would fix this completely.

6. CTA section - spacing between buttons is too large

The gap between "Get Started Now" and "Star on GitHub" is a bit much. A small spacing reduction here would make it look more polished.

7. Footer links are not properly aligned

The footer links break into two uneven rows - "Try Live", "Documentation", "GitHub" on one line and "Report Issue", "Contributing" on the next. It looks a bit off, centering or evenly spacing them would clean it up nicely.

---

Let me know if this works for you!

[SamXop123]

@hunain053 thank you for providing a detailed breakdown of the improvements that could be done.
i'm assigning this, you can proceed with the implementation!