39 lines
1.1 KiB
TypeScript
39 lines
1.1 KiB
TypeScript
import { Box, Typography, useTheme } from "@mui/material";
|
|
import { SxProps, Theme } from "@mui/material/styles";
|
|
|
|
|
|
interface Props {
|
|
sx?: SxProps<Theme>;
|
|
icon: React.ReactNode;
|
|
text?: string;
|
|
}
|
|
|
|
export default function UploadBox({ sx, icon, text }: Props) {
|
|
const theme = useTheme();
|
|
|
|
return (
|
|
<Box sx={{
|
|
width: "100%",
|
|
height: "120px",
|
|
position: "relative",
|
|
display: "flex",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
backgroundColor: theme.palette.background.default,
|
|
border: `1px solid ${theme.palette.grey2.main}`,
|
|
borderRadius: "8px",
|
|
...sx,
|
|
}}>
|
|
{icon}
|
|
<Typography sx={{
|
|
position: "absolute",
|
|
right: "10px",
|
|
bottom: "10px",
|
|
color: theme.palette.orange.main,
|
|
fontSize: "16px",
|
|
lineHeight: "19px",
|
|
textDecoration: "underline",
|
|
}}>{text}</Typography>
|
|
</Box>
|
|
);
|
|
} |