[Bug]: Navbar is not Responsive on Various Screen Sizes

[KAJAL7764]

Bug Description

The current navbar design is not responsive on smallers screen and appear misaligned

Provide a detailed description of the bug

When the screen size is decreased, the navbar becomes invisible, making it challenging for users to navigate the site on smaller devices, such as tablets or mobile phones.

Expected Behavior

1. Collapsing into a hamburger menu on smaller screens.
2. Ensuring the logo and menu items remain visible and properly aligned.
3. Providing smooth transitions and animations for menu expansion.

What browsers are you seeing the problem on?

Chrome

Put here any screenshots or videos (optional)

Could you assign me this task, I want to work on this projects.

By submitting this issue, you agree to

• [X] I agree to follow this project's Code of Conduct
• [X] I’ve read all the issues in the issue section, and this has not been reported yet.

Other Information

• [X] I'm a GSSoC '24 Extended contributor
• [X] I'm a Hacktoberfest '24 contributor
• [ ] I am willing to work on this issue (optional)

[github-actions[bot]]

@KAJAL7764

Thank you for raising this issue! 🎉🙌

We truly appreciate your contribution to this project and will review the details shortly. 🛠️✨ We will get back to you soon!

Thank you for your patience! 🙏

[maniyaom]

@KAJAL7764 assigned

[Coder-Harsha-2805]

I want to contribute

[maniyaom]

@KAJAL7764 what's the status?