Header Component
Application header with navigation, theme toggle, and responsive menu.
Live Demo
The header is visible at the top of this page. It includes:
- Sidebar toggle button (hamburger menu)
- Theme toggle (light/dark mode)
- Responsive design for mobile/desktop
Current Header Features:
Sidebar ToggleTheme SwitchResponsive
Implementation
Usage
import { Header } from '@/components/Header';
<Header />Features
- • Integrates with sidebar state via nanostores
- • Theme toggle persists preference
- • Fixed position with backdrop blur
- • Accessible keyboard navigation
File Location
src/components/Header.tsx