From dd7a8bf8d65cb3667dfafc556ee81847a8b7154c Mon Sep 17 00:00:00 2001 From: Yuvraj Singh Date: Thu, 16 Apr 2026 22:54:36 +0530 Subject: [PATCH 1/5] Fix mobile navbar visibility --- src/components/Navbar.jsx | 298 ++++++++++++++++++++++++++++++-------- 1 file changed, 240 insertions(+), 58 deletions(-) diff --git a/src/components/Navbar.jsx b/src/components/Navbar.jsx index ef90851..22ecade 100644 --- a/src/components/Navbar.jsx +++ b/src/components/Navbar.jsx @@ -1,15 +1,19 @@ "use client"; -import { useState, useRef, useEffect } from 'react'; -import Link from 'next/link'; -import { ChevronDown } from 'lucide-react'; -import { labs } from '../data/labs'; +import { useState, useRef, useEffect } from "react"; +import Link from "next/link"; +import { ChevronDown, Menu, X } from "lucide-react"; +import { labs } from "../data/labs"; -const singularityLogo = "https://res.cloudinary.com/djtemmctt/image/upload/v1771104005/singularity_new_logo_knedxr.png"; +const singularityLogo = + "https://res.cloudinary.com/djtemmctt/image/upload/v1771104005/singularity_new_logo_knedxr.png"; export default function Navbar() { const [labsDropdownOpen, setLabsDropdownOpen] = useState(false); const [eventsDropdownOpen, setEventsDropdownOpen] = useState(false); + const [mobileMenuOpen, setMobileMenuOpen] = useState(false); + const [mobileLabsOpen, setMobileLabsOpen] = useState(false); + const [mobileEventsOpen, setMobileEventsOpen] = useState(false); const labsDropdownRef = useRef(null); const eventsDropdownRef = useRef(null); @@ -17,100 +21,278 @@ export default function Navbar() { { id: "schrodingers-cat", name: "Schrödinger's Cat", - url: "https://schrodingerscat.singularitylabsrmap.space/" - } + url: "https://schrodingerscat.singularitylabsrmap.space/", + }, ]; + // Close dropdowns on outside click (desktop) useEffect(() => { - // Removed the ': MouseEvent' and 'as Node' types const handleOutsideClick = (e) => { - if (labsDropdownRef.current && !labsDropdownRef.current.contains(e.target)) { + if ( + labsDropdownRef.current && + !labsDropdownRef.current.contains(e.target) + ) { setLabsDropdownOpen(false); } - if (eventsDropdownRef.current && !eventsDropdownRef.current.contains(e.target)) { + if ( + eventsDropdownRef.current && + !eventsDropdownRef.current.contains(e.target) + ) { setEventsDropdownOpen(false); } }; if (labsDropdownOpen || eventsDropdownOpen) { - document.addEventListener('click', handleOutsideClick); - return () => document.removeEventListener('click', handleOutsideClick); + document.addEventListener("click", handleOutsideClick); + return () => document.removeEventListener("click", handleOutsideClick); } }, [labsDropdownOpen, eventsDropdownOpen]); + // Lock body scroll when mobile menu is open + useEffect(() => { + if (mobileMenuOpen) { + document.body.style.overflow = "hidden"; + } else { + document.body.style.overflow = ""; + } + return () => { + document.body.style.overflow = ""; + }; + }, [mobileMenuOpen]); + + const closeMobileMenu = () => { + setMobileMenuOpen(false); + setMobileLabsOpen(false); + setMobileEventsOpen(false); + }; + return ( - + + {/* ===== Mobile Fullscreen Menu Overlay ===== */} +
+ {/* Mobile menu content — pushed below the navbar */} +
+ {/* About Us */} + + About Us + + + {/* Labs Accordion */} +
- LABS - - - - {labsDropdownOpen && ( -
+ +
{labs.map((lab) => ( setLabsDropdownOpen(false)} - className="block w-full text-left px-4 py-2 hover:bg-white/10 transition-colors text-white/80 hover:text-white text-xs whitespace-nowrap" + onClick={closeMobileMenu} + className="block py-2.5 pl-4 text-white/60 hover:text-white text-base font-mono tracking-wider transition-colors" > {lab.name} ))}
- )} -
+
-
- - - {eventsDropdownOpen && ( -
+ + - )} +
+ + {/* Contact */} + + Contact +
- - Contact - + {/* Bottom branding in mobile menu */} +
+ Singularity Student Lab — SRMAP +
- + ); -} \ No newline at end of file +} From 0e0cf29fc7ba4d516d14ec84acbfd990964028e7 Mon Sep 17 00:00:00 2001 From: Yuvraj Singh Date: Fri, 17 Apr 2026 22:21:10 +0530 Subject: [PATCH 2/5] fix: use valid Tailwind min-width utilities in navbar dropdowns --- src/components/Navbar.jsx | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/src/components/Navbar.jsx b/src/components/Navbar.jsx index 22ecade..35633b0 100644 --- a/src/components/Navbar.jsx +++ b/src/components/Navbar.jsx @@ -69,7 +69,7 @@ export default function Navbar() { return ( <> {/* ===== Main Navbar ===== */} -