109 lines
2.5 KiB
TypeScript
109 lines
2.5 KiB
TypeScript
import { createTheme } from "@mui/material";
|
|
|
|
|
|
const theme = createTheme({
|
|
breakpoints: {
|
|
values: {
|
|
xs: 300,
|
|
sm: 560,
|
|
md: 900,
|
|
lg: 1200,
|
|
xl: 1536,
|
|
},
|
|
},
|
|
components: {
|
|
MuiTypography: {
|
|
defaultProps: {
|
|
variantMapping: {
|
|
p1: "p",
|
|
}
|
|
},
|
|
}
|
|
},
|
|
typography: {
|
|
h5: { // H2 в макете
|
|
fontSize: "24px",
|
|
lineHeight: "28.44px",
|
|
fontWeight: 500,
|
|
},
|
|
button: {
|
|
fontSize: "18px",
|
|
lineHeight: "24px",
|
|
fontWeight: 400,
|
|
textTransform: "none",
|
|
},
|
|
body1: { // T1 в макете
|
|
fontSize: "18px",
|
|
lineHeight: "21.33px",
|
|
fontWeight: 400,
|
|
},
|
|
body2: { // M1 в макете
|
|
fontSize: "16px",
|
|
lineHeight: "20px",
|
|
fontWeight: 500,
|
|
},
|
|
p1: { // P1 в макете
|
|
fontSize: "20px",
|
|
lineHeight: "24px",
|
|
fontWeight: 500,
|
|
},
|
|
price: {
|
|
fontWeight: 500,
|
|
fontSize: "20px",
|
|
lineHeight: "24px",
|
|
color: "#4D4D4D",
|
|
},
|
|
oldPrice: {
|
|
fontWeight: 400,
|
|
fontSize: "18px",
|
|
lineHeight: "21px",
|
|
textDecorationLine: "line-through",
|
|
color: "#FB5607",
|
|
},
|
|
fontFamily: [
|
|
"Rubik",
|
|
"-apple-system",
|
|
"BlinkMacSystemFont",
|
|
'"Segoe UI"',
|
|
'"Helvetica Neue"',
|
|
"Arial",
|
|
"sans-serif",
|
|
'"Apple Color Emoji"',
|
|
'"Segoe UI Emoji"',
|
|
'"Segoe UI Symbol"',
|
|
].join(","),
|
|
},
|
|
});
|
|
|
|
theme.typography.h2 = {
|
|
fontSize: "70px",
|
|
lineHeight: "70px",
|
|
fontWeight: 500,
|
|
[theme.breakpoints.down("md")]: {
|
|
fontSize: "42px",
|
|
lineHeight: "50px",
|
|
}
|
|
};
|
|
|
|
theme.typography.h4 = { // H1 в макете
|
|
fontSize: "36px",
|
|
lineHeight: "42.66px",
|
|
fontWeight: 500,
|
|
[theme.breakpoints.down("md")]: {
|
|
fontSize: "24px",
|
|
lineHeight: "28.44px",
|
|
}
|
|
};
|
|
|
|
theme.typography.infographic = {
|
|
fontSize: "80px",
|
|
lineHeight: "94.8px",
|
|
fontWeight: 400,
|
|
[theme.breakpoints.down("md")]: {
|
|
fontSize: "50px",
|
|
lineHeight: "59px",
|
|
fontWeight: 400,
|
|
}
|
|
};
|
|
|
|
export default theme; |