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 useStyles = makeStyles(theme => ({
7 layout: {
8 display: 'flex',
9 alignItems: 'center',
10 justifyContent: 'center',
11 minHeight: '100vh',
12 },
13}));
14
15const CenteredLayout = ({children}) => {
16 const classes = useStyles();
17
18 return (
19 <DefaultLayout>
20 <div className={classes.layout}>
21 <Container maxWidth="sm">{children}</Container>
22 </div>
23 </DefaultLayout>
24 );
25};
26
27export default CenteredLayout;