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

[sainimanpreet]

Have you completed your first issue?

• [x] I have completed my first issue

Guidelines

• [x] 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 .

[github-actions[bot]]

🙌 Thank you for bringing this to our attention! We appreciate your input and will investigate it as soon as possible.

Feel free to join our community on Discord to discuss more!

[sainimanpreet]

Hi! I’d like to work on this issue I raised. Please assign this to me.

[jyothika-badugu]

Hi @UTSAVS26 ,

I'm a contributor for GSSoC 2025 and would love to work on this enhancement as my contribution to the project. I've gone through the issue ,kindly assign it to me so I can get started.

Looking forward to your approval. Thank you!

[UTSAVS26]

Hi @jyothika-badugu, you are open to raise new issues as by the rules this issue is gonna assigned to @sainimanpreet as @sainimanpreet raises it.

[UTSAVS26]

@sainimanpreet can you link which portfolio website you are linking here?

[sainimanpreet]

Hi @UTSAVS26 Thanks for responding! 🙌 I'm referring to the Portfolio Website under the Web_Development/Portfolio Website section of this repository:PyVerse/Web_Development/Portfolio Website

I plan to enhance this specific folder by adding: Responsive design using Flexbox/Grid A dark mode toggle with theme persistence Minor UI improvements like smooth scroll and subtle animations Let me know if you'd like me to make a forked demo or a branch-based enhancement directly. Looking forward to your approval so I can begin working on it!

[UTSAVS26]

In the web development directory there is no portfolio website folder Can you send a link where it is?

[Gracee-b]

Hi, I would like to work on this issue as a contributor for GSSoC 2025. Kindly assign it to me if it's available.

[sampada115]

Hi could you please assign this task to me?