Shadcn Setup + Global Layout Shell + Navbar

[calebyhan]

Motivation

Every frontend page depends on the layout shell. Setting up Shadcn and the global nav structure first means all other frontend devs can immediately build pages within a consistent design system.

Deliverables

• Install and initialize Shadcn UI (npx shadcn-ui@latest init)
• Configure Tailwind theme with UNC brand colors (Carolina Blue #4B9CD3, black, white - able to change in the future)
• Install initial Shadcn components: Button, Table, Input, Card, Sheet (for mobile nav), NavigationMenu
• Create src/components/layout/Header.tsx with full navigation matching TDD site structure:
  • Home
  • News
  • Senators (dropdown: Leadership, Roster, Contact Your Senator, Previous Leadership)
  • Committees
  • Legislation (dropdown: Search, Recent Legislation, Recent Nominations, Senate Rules, Public Disclosure, Senate Archives)
  • About (dropdown: Staff, Powers of the Senate, How a Bill Becomes a Law, Elections)
  • Funding (dropdown: How to Apply, Budget Process, Where Does My Money Go?)
  • Meetings
• Create src/components/layout/Footer.tsx with basic senate contact info and links
• Create responsive mobile navigation (hamburger menu using Shadcn Sheet)
• Update src/app/layout.tsx to include Header and Footer

Important Notes

• No dependencies — start immediately
• "Senate Archives" links to an external Google Drive URL (use target="_blank")
• The "Finance Hearing Scheduling" button on the homepage is conditional and NOT part of the nav — do not add it here
• Follow WCAG accessibility: semantic HTML, keyboard-navigable nav, proper aria labels
• Use Next.js Link component for all internal navigation