- Initialize Next.js 14 web application with Material UI and TypeScript - Implement authentication (login/register) with device fingerprint - Create mobile-first responsive layout with app shell pattern - Add tracking pages for feeding, sleep, and diaper changes - Implement activity history with filtering - Configure backend CORS for web frontend (port 3030) - Update backend port to 3020, frontend to 3030 - Fix API response handling for auth endpoints 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
124 lines
2.4 KiB
TypeScript
124 lines
2.4 KiB
TypeScript
'use client';
|
|
|
|
import { createTheme } from '@mui/material/styles';
|
|
|
|
export const maternalTheme = createTheme({
|
|
palette: {
|
|
primary: {
|
|
main: '#FFB6C1', // Light pink/rose
|
|
light: '#FFE4E1', // Misty rose
|
|
dark: '#DB7093', // Pale violet red
|
|
},
|
|
secondary: {
|
|
main: '#FFDAB9', // Peach puff
|
|
light: '#FFE5CC',
|
|
dark: '#FFB347', // Deep peach
|
|
},
|
|
background: {
|
|
default: '#FFF9F5', // Warm white
|
|
paper: '#FFFFFF',
|
|
},
|
|
text: {
|
|
primary: '#2D3748',
|
|
secondary: '#718096',
|
|
},
|
|
},
|
|
typography: {
|
|
fontFamily: '"Inter", "Roboto", "Helvetica", "Arial", sans-serif',
|
|
h1: {
|
|
fontSize: '2rem',
|
|
fontWeight: 600,
|
|
},
|
|
h2: {
|
|
fontSize: '1.75rem',
|
|
fontWeight: 600,
|
|
},
|
|
h3: {
|
|
fontSize: '1.5rem',
|
|
fontWeight: 600,
|
|
},
|
|
h4: {
|
|
fontSize: '1.25rem',
|
|
fontWeight: 600,
|
|
},
|
|
h5: {
|
|
fontSize: '1.125rem',
|
|
fontWeight: 600,
|
|
},
|
|
h6: {
|
|
fontSize: '1rem',
|
|
fontWeight: 600,
|
|
},
|
|
body1: {
|
|
fontSize: '1rem',
|
|
},
|
|
body2: {
|
|
fontSize: '0.875rem',
|
|
},
|
|
},
|
|
shape: {
|
|
borderRadius: 16,
|
|
},
|
|
components: {
|
|
MuiButton: {
|
|
styleOverrides: {
|
|
root: {
|
|
borderRadius: 24,
|
|
textTransform: 'none',
|
|
minHeight: 48, // Touch target size
|
|
fontSize: '1rem',
|
|
fontWeight: 500,
|
|
paddingLeft: 24,
|
|
paddingRight: 24,
|
|
},
|
|
sizeLarge: {
|
|
minHeight: 56,
|
|
fontSize: '1.125rem',
|
|
},
|
|
},
|
|
},
|
|
MuiTextField: {
|
|
styleOverrides: {
|
|
root: {
|
|
'& .MuiInputBase-root': {
|
|
minHeight: 48,
|
|
borderRadius: 16,
|
|
},
|
|
},
|
|
},
|
|
},
|
|
MuiCard: {
|
|
styleOverrides: {
|
|
root: {
|
|
borderRadius: 20,
|
|
boxShadow: '0 4px 20px rgba(0, 0, 0, 0.08)',
|
|
},
|
|
},
|
|
},
|
|
MuiPaper: {
|
|
styleOverrides: {
|
|
root: {
|
|
borderRadius: 16,
|
|
},
|
|
elevation1: {
|
|
boxShadow: '0 2px 10px rgba(0, 0, 0, 0.06)',
|
|
},
|
|
elevation2: {
|
|
boxShadow: '0 4px 20px rgba(0, 0, 0, 0.08)',
|
|
},
|
|
elevation3: {
|
|
boxShadow: '0 6px 30px rgba(0, 0, 0, 0.1)',
|
|
},
|
|
},
|
|
},
|
|
MuiChip: {
|
|
styleOverrides: {
|
|
root: {
|
|
borderRadius: 12,
|
|
fontWeight: 500,
|
|
},
|
|
},
|
|
},
|
|
},
|
|
});
|