52 lines
1017 B
React
52 lines
1017 B
React
// Components
|
|
import { Stack } from "@mui/material";
|
|
|
|
// Utils
|
|
import { useTheme } from "@emotion/react";
|
|
|
|
const Container = ({ children, direction, backgroundColor, sx }) => {
|
|
const theme = useTheme();
|
|
let bgColor =
|
|
typeof backgroundColor !== "undefined"
|
|
? backgroundColor
|
|
: theme.palette.background.main;
|
|
return (
|
|
<Stack
|
|
direction={direction}
|
|
padding={theme.spacing(8)}
|
|
gap={theme.spacing(2)}
|
|
border={1}
|
|
borderColor={theme.palette.primary.lowContrast}
|
|
borderRadius={theme.spacing(4)}
|
|
backgroundColor={bgColor}
|
|
sx={{ ...sx }}
|
|
>
|
|
{children}
|
|
</Stack>
|
|
);
|
|
};
|
|
|
|
export const ColContainer = ({ children, backgroundColor, sx }) => {
|
|
return (
|
|
<Container
|
|
direction="column"
|
|
backgroundColor={backgroundColor}
|
|
sx={{ ...sx }}
|
|
>
|
|
{children}
|
|
</Container>
|
|
);
|
|
};
|
|
|
|
export const RowContainer = ({ children, backgroundColor, sx }) => {
|
|
return (
|
|
<Container
|
|
direction="row"
|
|
backgroundColor={backgroundColor}
|
|
sx={{ ...sx }}
|
|
>
|
|
{children}
|
|
</Container>
|
|
);
|
|
};
|