51248b24f7
- Apply new teal-based color palette (#009688, #00796B, #B2DFDB) - Update secondary color to accent yellow (#FFC107) - Replace Material-UI loading states with proper animations and skeletons - Remove ugly gradient background, replace with clean white - Update all gradients to use new color scheme - Improve text colors for better readability (#212121, #757575) 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
91 lines
1.8 KiB
TypeScript
91 lines
1.8 KiB
TypeScript
'use client'
|
|
import { createTheme } from '@mui/material/styles'
|
|
|
|
export const theme = createTheme({
|
|
palette: {
|
|
mode: 'light',
|
|
primary: {
|
|
main: '#009688', // PRIMARY COLOR
|
|
light: '#B2DFDB', // LIGHT PRIMARY COLOR
|
|
dark: '#00796B', // DARK PRIMARY COLOR
|
|
contrastText: '#FFFFFF', // TEXT / ICONS
|
|
},
|
|
secondary: {
|
|
main: '#FFC107', // ACCENT COLOR
|
|
light: '#FFECB3',
|
|
dark: '#FF8F00',
|
|
contrastText: '#212121',
|
|
},
|
|
background: {
|
|
default: '#FAFAFA',
|
|
paper: '#FFFFFF',
|
|
},
|
|
text: {
|
|
primary: '#212121', // PRIMARY TEXT
|
|
secondary: '#757575', // SECONDARY TEXT
|
|
},
|
|
divider: '#BDBDBD', // DIVIDER COLOR
|
|
},
|
|
typography: {
|
|
fontFamily: '"Roboto", "Helvetica", "Arial", sans-serif',
|
|
h1: {
|
|
fontSize: '2.5rem',
|
|
fontWeight: 600,
|
|
lineHeight: 1.2,
|
|
},
|
|
h2: {
|
|
fontSize: '2rem',
|
|
fontWeight: 600,
|
|
lineHeight: 1.3,
|
|
},
|
|
h3: {
|
|
fontSize: '1.5rem',
|
|
fontWeight: 500,
|
|
lineHeight: 1.4,
|
|
},
|
|
h4: {
|
|
fontSize: '1.25rem',
|
|
fontWeight: 500,
|
|
lineHeight: 1.4,
|
|
},
|
|
body1: {
|
|
fontSize: '1rem',
|
|
lineHeight: 1.6,
|
|
},
|
|
body2: {
|
|
fontSize: '0.875rem',
|
|
lineHeight: 1.5,
|
|
},
|
|
},
|
|
shape: {
|
|
borderRadius: 8,
|
|
},
|
|
components: {
|
|
MuiButton: {
|
|
styleOverrides: {
|
|
root: {
|
|
textTransform: 'none',
|
|
borderRadius: 8,
|
|
padding: '8px 16px',
|
|
},
|
|
},
|
|
},
|
|
MuiCard: {
|
|
styleOverrides: {
|
|
root: {
|
|
boxShadow: '0px 2px 8px rgba(0, 0, 0, 0.1)',
|
|
borderRadius: 12,
|
|
},
|
|
},
|
|
},
|
|
MuiAppBar: {
|
|
styleOverrides: {
|
|
root: {
|
|
boxShadow: '0px 1px 4px rgba(0, 0, 0, 0.1)',
|
|
},
|
|
},
|
|
},
|
|
},
|
|
})
|
|
|
|
export default theme |