Spaces:
Runtime error
Runtime error
File size: 1,622 Bytes
2f65818 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
import { Divider, DividerProps, Paper, PaperProps } from "@mui/material";
import { styled } from "@mui/material/styles";
export const SectionBox = styled(Paper)<PaperProps>(({ theme }) => ({
display: "flex",
padding: 15,
paddingTop: 30,
paddingBottom: 30,
marginBottom: 20,
background: `linear-gradient(to bottom right, ${theme.palette.primary.main} 0%, ${theme.palette.secondary.main} 100%)`,
}));
export const HighlightBox = styled(Paper)<PaperProps>(({ theme }) => ({
display: "flex",
alignItems: "center",
justifyContent: "center",
padding: 10,
borderBottom: `3px solid transparent`,
borderImage: `linear-gradient(to bottom right, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%)`,
borderImageSlice: 1,
}));
export const RainbowBox = styled("div")(({ theme }) => ({
border: `1px solid transparent`,
borderImage: `linear-gradient(to bottom right, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%)`,
borderImageSlice: 1,
}));
export const DividerBox = styled(Divider)<DividerProps>(({ theme }) => ({
marginTop: 20,
marginBottom: 20,
background: "transparent",
border: "none",
}));
export const MarkerBox = styled("span")(({ theme }) => ({
padding: 2,
background: `linear-gradient(to bottom right, ${theme.palette.primary.main} 0%, ${theme.palette.secondary.main} 100%)`,
}));
export const OutlinedBox = styled("span")(({ theme }) => ({
...theme.typography.body1,
padding: theme.spacing(0.25),
border: `1px solid ${theme.palette.grey[800]}`,
borderRadius: theme.shape.borderRadius,
transition: theme.transitions.create(["border-color", "box-shadow"]),
}));
|