[Bug/Enhancement]: Navbar design and its items are misaligned

[akashyeole]

What happened?

Navbar design and its items are misaligned
When you scroll the page, the content that goes up behind the navbar is clearly visible.
Also the dark mode toggle (on the right) and logo(on the left) are not properly aligned to the nav container

Navbar could be better.

I would like to work on this if confirmed that this needs improvement!

Add screenshots

What browsers are you seeing the problem on?

Microsoft Edge

Code of Conduct

• I agree to follow this project's Code of Conduct

[github-actions]

Congratulations, @akashyeole! 🎉 Thank you for creating your first issue. Your contribution is greatly appreciated and we look forward to working with you to resolve the issue. Keep up the great work!