app/src/layouts/Centered.js (view raw)
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;