Add comprehensive .gitignore

maternal-web/components/layouts/AppShell/AppShell.tsx

@@ -0,0 +1,41 @@
+'use client';
+
+import { Box, Container } from '@mui/material';
+import { MobileNav } from '../MobileNav/MobileNav';
+import { TabBar } from '../TabBar/TabBar';
+import { useMediaQuery } from '@/hooks/useMediaQuery';
+import { ReactNode } from 'react';
+
+interface AppShellProps {
+  children: ReactNode;
+}
+
+export const AppShell = ({ children }: AppShellProps) => {
+  const isMobile = useMediaQuery('(max-width: 768px)');
+  const isTablet = useMediaQuery('(max-width: 1024px)');
+
+  return (
+    <Box sx={{
+      display: 'flex',
+      flexDirection: 'column',
+      minHeight: '100vh',
+      bgcolor: 'background.default',
+      pb: isMobile ? '64px' : 0, // Space for tab bar
+    }}>
+      {!isMobile && <MobileNav />}
+
+      <Container
+        maxWidth={isTablet ? 'md' : 'lg'}
+        sx={{
+          flex: 1,
+          px: isMobile ? 2 : 3,
+          py: 3,
+        }}
+      >
+        {children}
+      </Container>
+
+      {isMobile && <TabBar />}
+    </Box>
+  );
+};