Appearance
Header
Responsive navigation header with mobile menu and sign-in button.
Usage
javascript
import Header from "@/components/Header";
// Wrap in Suspense (required — uses useSearchParams internally)
<Suspense>
<Header />
</Suspense>Behavior
- Desktop: horizontal nav links + sign-in button
- Mobile: hamburger menu that expands to full nav
- Automatically shows user account button when signed in
- Links configured inside the component file
Customization
Edit /components/Header.js to:
- Change nav links
- Update the logo (references
logoAndName.pngfrom/public) - Adjust the CTA button in the header
Logo
Place logoAndName.png in /public. NextAuth also uses this file on login pages.