2022-12-09 11:48:15 +00:00
|
|
|
import { Box, Typography } from "@mui/material";
|
|
|
|
|
|
|
|
|
|
|
|
interface Props {
|
|
|
|
header: string;
|
|
|
|
text: string;
|
|
|
|
image: any;
|
2023-05-26 18:27:33 +00:00
|
|
|
border?: string
|
2022-12-09 11:48:15 +00:00
|
|
|
}
|
|
|
|
|
2023-05-26 18:27:33 +00:00
|
|
|
export default function CreationCard({ header, text, image, border}: Props) {
|
2022-12-09 11:48:15 +00:00
|
|
|
|
|
|
|
return (
|
2022-12-26 10:00:03 +00:00
|
|
|
<Box sx={{
|
|
|
|
flexGrow: 1,
|
|
|
|
backgroundColor: "white",
|
|
|
|
p: "20px",
|
2023-05-26 18:27:33 +00:00
|
|
|
border: {border},
|
2022-12-26 10:00:03 +00:00
|
|
|
borderRadius: "12px",
|
|
|
|
display: "flex",
|
|
|
|
flexDirection: "column",
|
|
|
|
boxShadow: `0px 100px 309px rgba(210, 208, 225, 0.24),
|
2022-12-09 11:48:15 +00:00
|
|
|
0px 41.7776px 129.093px rgba(210, 208, 225, 0.172525),
|
|
|
|
0px 22.3363px 69.0192px rgba(210, 208, 225, 0.143066),
|
|
|
|
0px 12.5216px 38.6916px rgba(210, 208, 225, 0.12),
|
|
|
|
0px 6.6501px 20.5488px rgba(210, 208, 225, 0.0969343),
|
|
|
|
0px 2.76726px 8.55082px rgba(210, 208, 225, 0.0674749)`,
|
2022-12-26 10:00:03 +00:00
|
|
|
}}>
|
2022-12-09 11:48:15 +00:00
|
|
|
<Typography variant="h5">{header}</Typography>
|
|
|
|
<Typography
|
|
|
|
sx={{
|
|
|
|
color: "#4D4D4D",
|
|
|
|
mt: "20px",
|
|
|
|
mb: "35px",
|
|
|
|
width: "95%",
|
|
|
|
}}
|
|
|
|
>{text}</Typography>
|
|
|
|
<img
|
|
|
|
src={image}
|
|
|
|
alt="quiz creation"
|
|
|
|
style={{
|
|
|
|
display: "block",
|
|
|
|
width: "100%",
|
|
|
|
marginTop: "auto",
|
|
|
|
}}
|
|
|
|
/>
|
|
|
|
</Box>
|
|
|
|
);
|
|
|
|
}
|