Satakshijain / CodingHustlers

62 stars 61 forks source link

Issues with Mobile Responsiveness and Navigation Bar #47

Open ChaithanyaKrishna28 opened 6 months ago

ChaithanyaKrishna28 commented 6 months ago

1. Mobile Responsiveness Problem: The website is not responsive when viewed on mobile devices. This leads to a poor user experience as content may be cut off or difficult to read.

2. Navigation Bar Enhancement:

In the mobile view, the navigation bar could be improved for better usability. Instead of a fixed navigation bar taking up space, it could be replaced with a collapsible menu activated by tapping three horizontal lines (commonly known as a "hamburger" icon). This would provide a cleaner and more intuitive navigation experience for mobile users.

mobile_view tabletview

Steps to Reproduce:

  1. Open the website on a mobile device or using a mobile device emulator.
  2. Notice the lack of responsiveness and how the navigation bar occupies space.
  3. Suggest tapping on the three horizontal lines to reveal a collapsible menu for navigation.

Proposed Solution:

  1. Implement responsive design principles to ensure the website adapts to various screen sizes.
  2. Replace the static navigation bar in mobile view with a collapsible menu activated by tapping on the three horizontal lines.

I would love to work on this enhancements, @Satakshijain Please assign this to me @ChaithanyaKrishna28

ayush-kumarrai commented 6 months ago

I can make your website responsive ma'am. Just assign me this issue.

gargimukherjee25 commented 6 months ago

Hello @Satakshijain I am Gargi! I work with html,css,js,react.js and so on and am eager to learn more. I'd appreciate being assigned this task for GSSoC 24.