1import React from 'react';
 2import Container from '@material-ui/core/Container';
 3import DefaultLayout from './Default';
 4import {makeStyles} from '@material-ui/core/styles';
 5
 6const CenteredLayout = ({children, ...props}) => {
 7  const classes = useStyles();
 8
 9  return (
10    <DefaultLayout {...props}>
11      <div className={classes.layout}>
12        <Container maxWidth="sm">{children}</Container>
13      </div>
14    </DefaultLayout>
15  );
16};
17
18const useStyles = makeStyles(theme => ({
19  layout: {
20    display: 'flex',
21    alignItems: 'center',
22    justifyContent: 'center',
23    minHeight: '100vh',
24  },
25}));
26
27export default CenteredLayout;