cdn-frontend/src/pages/notifications/styles.js

75 lines
1.6 KiB
JavaScript

import { makeStyles } from "@material-ui/styles";
import tinycolor from "tinycolor2";
export default makeStyles((theme) => ({
layoutContainer: {
height: 200,
display: "flex",
flexDirection: "column",
justifyContent: "space-between",
alignItems: "center",
marginTop: theme.spacing(2),
border: "1px dashed",
borderColor: theme.palette.primary.main,
position: "relative"
},
layoutText: {
color: tinycolor(theme.palette.background.light).darken().toHexString()
},
layoutButtonsRow: {
width: "100%",
display: "flex",
justifyContent: "space-between"
},
layoutButton: {
backgroundColor: theme.palette.background.light,
width: 125,
height: 50,
outline: "none",
border: "none"
},
layoutButtonActive: {
backgroundColor: tinycolor(theme.palette.background.light)
.darken()
.toHexString()
},
buttonsContainer: {
display: "flex",
flexDirection: "column",
alignItems: "flex-start",
marginTop: theme.spacing(2)
},
notificationCallButton: {
color: "white",
marginBottom: theme.spacing(1),
textTransform: "none"
},
codeContainer: {
display: "flex",
flexDirection: "column",
marginTop: theme.spacing(2)
},
codeComponent: {
flexGrow: 1
},
notificationItem: {
marginTop: theme.spacing(2)
},
progress: {
visibility: "hidden"
},
notification: {
display: "flex",
alignItems: "center",
background: "transparent",
boxShadow: "none",
overflow: "visible"
},
notificationComponent: {
paddingRight: theme.spacing(4)
},
widgetHeader: {
paddingBottom: 8
}
}));