dakshsinghrathore / ISRO-web

This website aims to adapt SpaceX's official website by incorporating ISRO's content, offering a unique fusion of both organizations.
https://dsr-isrowebapp.netlify.app/
MIT License
43 stars 62 forks source link

BUG: Menu Icon Overlaps Navigation Bar Items on Small Screens #99

Closed jaitensahu closed 11 months ago

jaitensahu commented 11 months ago

Is there an existing issue for this?

What happened?

On smaller screens, such as mobile devices or narrow viewports, a user interface issue has been identified. When the website is viewed on these smaller screens, the menu icon overlaps with the navigation bar items, resulting in a suboptimal user experience.

Steps to Reproduce:

  1. Access the website on a mobile device or resize the browser window to a smaller viewport.
  2. Observe the navigation bar, particularly the menu icon and navigation items.
  3. Note that the menu icon appears to overlap with the navigation items, potentially causing issues with user interaction and readability.

https://github.com/dakshsinghrathore/ISRO-web/assets/127736781/f79f78d1-f1ee-43c5-957a-9760bc472356

Expected Behavior

  1. On larger screens, the navigation bar should display all individual navigation tab items, providing users with direct access to various sections of the website.

  2. On smaller screens, such as mobile devices or narrow viewports, the navigation bar should adapt to a more space-efficient design. In this responsive design, all individual navigation tab items should be merged into a collapsible menu (commonly represented by a menu icon or "hamburger" icon).

  3. When the user interacts with the menu icon on smaller screens, the collapsible menu should expand to display the full list of navigation items, ensuring a seamless and user-friendly navigation experience.

  4. The responsive design should prioritize readability, ease of use, and a visually appealing layout to accommodate limited screen real estate while maintaining the website's functionality.

Record

github-actions[bot] commented 11 months ago

Congratulations, @jaitensahu! πŸŽ‰ Thank you for creating your issue. Your contribution is greatly appreciated and I look forward to work with you to resolve the issue. Keep up the great work!

I will promptly review your changes and offer feedback. Keep up the excellent work! Kindly remember to check my contributing guidelines

dakshsinghrathore commented 11 months ago

@jaitensahu Thanks for finding out the bug ! kindly star the repo and a follow will be highly appreciated ! πŸ™ŒπŸ½πŸ˜€

jaitensahu commented 11 months ago

hi @dakshsinghrathore Already followed you and starred the repo