60 lines
996 B
TypeScript
60 lines
996 B
TypeScript
import { createTheme } from '@mui/material/styles';
|
|
|
|
const palette = {
|
|
primary: {
|
|
main: '#1976d2',
|
|
},
|
|
secondary: {
|
|
main: '#d32f2f',
|
|
},
|
|
background: {
|
|
default: '#fafafa',
|
|
paper: '#ffffff',
|
|
primary: 'rgb(69, 190, 171)',
|
|
},
|
|
text: {
|
|
primary: '#000000',
|
|
secondary: '#555555',
|
|
tertiary: '#fff',
|
|
},
|
|
action: {
|
|
hover: 'rgba(0, 0, 0, 0.08)',
|
|
},
|
|
};
|
|
|
|
const typography = {
|
|
fontFamily: '"Roboto", "Helvetica", "Arial", sans-serif',
|
|
h1: {
|
|
fontSize: '3rem',
|
|
fontWeight: 700,
|
|
},
|
|
h2: {
|
|
fontSize: '2.5rem',
|
|
fontWeight: 700,
|
|
},
|
|
body1: {
|
|
fontSize: '1rem',
|
|
fontWeight: 400,
|
|
},
|
|
};
|
|
|
|
// Create the theme based on the light or dark mode preference
|
|
const theme = createTheme({
|
|
palette: {
|
|
mode: 'light', // Change this to 'dark' for dark mode
|
|
...palette
|
|
},
|
|
// typography,
|
|
breakpoints: {
|
|
values: {
|
|
xs: 0,
|
|
sm: 600,
|
|
md: 960,
|
|
lg: 1280,
|
|
xl: 1920,
|
|
},
|
|
},
|
|
});
|
|
|
|
export default theme;
|