add cards
This commit is contained in:
parent
f433da3a35
commit
04a4b0cfc9
39
src/components/CreateQuiz/CardWithImage.tsx
Normal file
39
src/components/CreateQuiz/CardWithImage.tsx
Normal file
@ -0,0 +1,39 @@
|
|||||||
|
import { Box, Typography, useTheme } from "@mui/material";
|
||||||
|
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
image: string;
|
||||||
|
text: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function CardWithImage({ image, text }: Props) {
|
||||||
|
const theme = useTheme();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Box sx={{
|
||||||
|
flexGrow: 1,
|
||||||
|
borderRadius: "12px",
|
||||||
|
backgroundColor: "white",
|
||||||
|
boxShadow: `0px 100px 309px rgba(210, 208, 225, 0.24),
|
||||||
|
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)`,
|
||||||
|
}}>
|
||||||
|
<img
|
||||||
|
style={{
|
||||||
|
width: "100%",
|
||||||
|
display: "block",
|
||||||
|
borderBottom: `1px solid ${theme.palette.grey2.main}`,
|
||||||
|
}}
|
||||||
|
src={image}
|
||||||
|
alt="card"
|
||||||
|
/>
|
||||||
|
<Typography
|
||||||
|
color={theme.palette.grey3.main}
|
||||||
|
p="20px"
|
||||||
|
>{text}</Typography>
|
||||||
|
</Box>
|
||||||
|
);
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user