49 lines
1.2 KiB
JavaScript
49 lines
1.2 KiB
JavaScript
import React from 'react';
|
|
|
|
import makeStyles from '@mui/styles/makeStyles';
|
|
import Grid from '@mui/material/Grid';
|
|
import Paper from '@mui/material/Paper';
|
|
|
|
const useStyles = makeStyles((theme) => ({
|
|
PaperM: {
|
|
padding: '3em 3.5em 3em 3.5em!important',
|
|
},
|
|
PaperL: {
|
|
padding: '4em 4.5em 4em 4.5em!important',
|
|
},
|
|
PaperService: {
|
|
padding: '4em 4.5em 4em 4.5em!important',
|
|
border: `1px solid ${theme.palette.background.light1}`,
|
|
backgroundColor: theme.palette.service.contrastText,
|
|
},
|
|
}));
|
|
|
|
const Component = React.forwardRef((props, ref) => {
|
|
const classes = useStyles();
|
|
let { marginBottom, xs, sm, md, ld, className, elevation, ...other } = props;
|
|
|
|
elevation = 0;
|
|
|
|
return (
|
|
<Grid container justifyContent="center" spacing={1} style={{ marginBottom: props.marginBottom }}>
|
|
<Grid item xs={props.xs} sm={props.sm} md={props.md} lg={props.lg}>
|
|
<Paper className={classes[props.className]} elevation={elevation} ref={ref} {...other}>
|
|
{props.children}
|
|
</Paper>
|
|
</Grid>
|
|
</Grid>
|
|
);
|
|
});
|
|
|
|
export default Component;
|
|
|
|
Component.defaultProps = {
|
|
marginBottom: '6em',
|
|
xs: 12,
|
|
sm: undefined,
|
|
md: undefined,
|
|
lg: undefined,
|
|
elevation: 0,
|
|
className: 'paper',
|
|
};
|