Skip to content

[Code Addition Request]]: Add Responsive Design and Dark Mode Toggle to Portfolio Website #1524

@sainimanpreet

Description

@sainimanpreet

Have you completed your first issue?

  • I have completed my first issue

Guidelines

  • I have read the guidelines
  • I have the link to my latest merged PR

Latest Merged PR Link

N/A

Project Description

The current Portfolio Website in the PyVerse Web_Development section is a great starting point but lacks essential modern features like responsiveness and theme customization. I propose a comprehensive enhancement that significantly improves both user experience and interface quality.

🔧 What I Will Add:

  1. Responsive Design:

    • Refactor the layout using CSS Flexbox and Grid.
    • Make all sections (hero, about, projects, etc.) fully responsive on tablets and mobile.
    • Introduce a hamburger menu for navigation on smaller screens.
  2. Dark Mode Toggle:

    • Add a dark/light theme switcher using vanilla JavaScript.
    • Use localStorage to preserve the user's theme preference across sessions.
    • Ensure proper color contrast and accessibility in both themes.
  3. Minor UI/UX Improvements:

    • Smooth scroll behavior between sections.
    • Add subtle animations for transitions (CSS or JavaScript-based).
    • Improve button and form styling to enhance interactivity.

I have experience building responsive and accessible web interfaces, and I’d love to implement this feature upgrade to improve the quality and maintainability of the project. Looking forward to your approval!

Full Name

Manpreet Saini

Participant Role

I have previously contributed to multiple open source programs such as Hacktoberfest and GSSoC. I'm also actively contributing to repositories for LFX mentorship preparation. I'm comfortable working with real-world codebases, raising meaningful issues, and following contribution guidelines. Looking forward to adding value .

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions