Improve mobile responsiveness of navbar across all devices #107
Description
Description:
The current navigation bar doesn’t adapt optimally across all screen sizes, especially on mobile and tablet devices. Enhancing its responsiveness will improve usability and the overall experience for users browsing the platform on smaller screens.
Tasks:
Adjust the navbar layout to scale properly from extra small screens (e.g., <480px) through larger viewports.
Add a mobile menu (hamburger icon + collapsible menu) for smaller device widths.
Ensure links, icons, and branding resize and align properly at each breakpoint.
Test behavior on common mobile devices and in multiple browsers.
Expected Outcome:
Navbar collapses neatly into a hamburger menu on narrow screens.
Navigation items are easy to tap and read on mobile.
Consistent layout and spacing across devices of all widths.
Tech Areas:
frontend, responsive design, TailwindCSS, React