@gorazdo/material-you
Version:
Material You theme for @material-ui library
107 lines (106 loc) • 3.07 kB
JavaScript
import { createTheme } from "@material-ui/core";
export const materialYouTheme = createTheme({
palette: {
primary: {
pale: "#f7e5d5",
light: "#f8dbd9",
main: "#c7595c",
dark: "#000",
accent: "#201b1a",
},
secondary: {
pale: "#edeeef",
light: "#7f9399",
main: "#5f5c57",
dark: "#2f3134",
accent: "#9decfc",
},
tertiary: {
pale: "#DBEA8D",
light: "#f8f580",
main: "#6A7439",
dark: "#000",
accent: "#E0796E",
},
},
shape: {
borderRadius: 24,
},
});
materialYouTheme.props = {
MuiButton: {
disableElevation: true,
},
};
materialYouTheme.overrides = {
MuiAvatar: {
colorDefault: {
backgroundColor: materialYouTheme.palette.common.white,
color: materialYouTheme.palette.common.black,
},
},
MuiSvgIcon: {
fontSizeSmall: {
fontSize: "1rem",
},
},
MuiBottomNavigationAction: {
label: {
fontSize: "0.875rem",
},
},
MuiButton: {
root: {
fontSize: 16,
textTransform: "unset",
paddingInlineStart: materialYouTheme.spacing(2),
paddingInlineEnd: materialYouTheme.spacing(2),
height: materialYouTheme.spacing(6),
},
sizeSmall: {
fontSize: 14,
paddingInlineStart: materialYouTheme.spacing(1.5),
paddingInlineEnd: materialYouTheme.spacing(1.5),
height: materialYouTheme.spacing(5),
},
sizeLarge: {
fontSize: 20,
padding: "unset",
minWidth: materialYouTheme.spacing(10),
paddingInlineStart: materialYouTheme.spacing(3),
paddingInlineEnd: materialYouTheme.spacing(3),
height: materialYouTheme.spacing(10),
borderRadius: materialYouTheme.spacing(5),
},
},
MuiCardContent: {
root: {
padding: materialYouTheme.spacing(3),
},
},
MuiListItemText: {
primary: {
fontWeight: 700,
},
secondary: {
fontWeight: 400,
},
},
MuiListItem: {
container: {
backgroundColor: materialYouTheme.palette.common.white,
marginBlockEnd: 2,
"&:first-child": {
borderTopLeftRadius: materialYouTheme.shape.borderRadius,
borderTopRightRadius: materialYouTheme.shape.borderRadius,
},
"&:last-child": {
borderBottomLeftRadius: materialYouTheme.shape.borderRadius,
borderBottomRightRadius: materialYouTheme.shape.borderRadius,
},
"&:not(:last-child)": {
marginBlockEnd: 1,
},
},
},
};