Sergei
1628501e75
Implemented responsive layout system with: - Header: Top navigation with profile menu and mobile hamburger - Sidebar: Desktop-only navigation sidebar (lg and above) - Breadcrumbs: Auto-generated navigation breadcrumbs - Layout: Main wrapper component with configurable options Features: - Responsive design (mobile, tablet, desktop) - Active route highlighting - User profile integration via auth store - Click-outside dropdown closing - Comprehensive test coverage (49 tests passing) Updated (main) layout to use new Layout component system. Updated dashboard page to work with new layout structure. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
30 lines
722 B
TypeScript
30 lines
722 B
TypeScript
/**
|
|
* Layout Components
|
|
*
|
|
* Provides consistent layout structure for the web application.
|
|
*
|
|
* Components:
|
|
* - Layout: Main layout wrapper with sidebar, header, and breadcrumbs
|
|
* - Header: Top navigation bar with profile menu
|
|
* - Sidebar: Desktop navigation sidebar
|
|
* - Breadcrumbs: Contextual navigation breadcrumbs
|
|
*
|
|
* @example
|
|
* ```tsx
|
|
* import { Layout } from '@/components/Layout';
|
|
*
|
|
* export default function DashboardPage() {
|
|
* return (
|
|
* <Layout title="Dashboard">
|
|
* <div>Content here</div>
|
|
* </Layout>
|
|
* );
|
|
* }
|
|
* ```
|
|
*/
|
|
|
|
export { Layout } from './Layout';
|
|
export { Header } from './Header';
|
|
export { Sidebar } from './Sidebar';
|
|
export { Breadcrumbs } from './Breadcrumbs';
|