ZEviod/open-source-mern

Improve responsive layout or spacing in a component's CSS

Open

#19 opened on Oct 6, 2025

View on GitHub
 (3 comments) (0 reactions) (1 assignee)JavaScript (7 forks)auto 404
enhancementfront-endgood first issuehacktoberfest

Repository metrics

Stars
 (10 stars)
PR merge metrics
 (PR metrics pending)

Description

Make a small improvement to the CSS of a component.
Examples: spacing fix, text alignment, mobile responsiveness, etc.

Relevant files:

  • src/components/*.css
  • src/index.css

🔧 What To Do

  • Run the app locally (npm start).
  • Inspect a component visually (e.g., Navbar, Footer, About).
  • Apply a CSS tweak: adjust padding, fix alignment, or add a responsive media query.
  • Submit a PR with a brief explanation of your change.

✅ Acceptance Criteria

  • Clear visual improvement on at least one screen size.
  • Change is scoped to CSS (with minimal markup change if necessary).

🧑‍🎓 Why This is Good for Beginners

  • Helps you get used to the local development flow.
  • Encourages testing visual changes and thinking in responsive design.

💡 Helpful Notes

  • Include before/after screenshots in your PR when possible.
  • Use browser devtools to simulate different device sizes.

Contributor guide

Research direction
Inspect the component's CSS file and use browser devtools to identify spacing or alignment issues. Apply a CSS tweak and verify responsiveness.
Tech stack
javascriptcss
Domain
frontend
Issue type
Refactor
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
1
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
Under 1 hour
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
Active
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
Clear
Prerequisites
GitCSSNode.js
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
90