2021-03-30 15:14:02 +02:00
|
|
|
import React from 'react';
|
2020-10-04 20:27:52 +02:00
|
|
|
import PropTypes from 'prop-types';
|
2021-02-26 10:42:34 +01:00
|
|
|
import classnames from 'classnames';
|
2021-03-30 15:14:02 +02:00
|
|
|
import { makeStyles } from '@material-ui/styles';
|
|
|
|
import { Grid, Container } from '@material-ui/core';
|
2020-10-04 20:27:52 +02:00
|
|
|
|
2021-01-07 13:36:13 +01:00
|
|
|
import styles from '../styles.module.scss';
|
2020-10-04 20:27:52 +02:00
|
|
|
import ErrorContainer from '../error/error-container';
|
2021-03-30 15:14:02 +02:00
|
|
|
import Header from '../menu/Header';
|
|
|
|
import Footer from '../menu/Footer/Footer';
|
2020-10-04 20:27:52 +02:00
|
|
|
|
2021-03-30 15:14:02 +02:00
|
|
|
const useStyles = makeStyles(theme => ({
|
|
|
|
footer: {
|
|
|
|
background: theme.palette.neutral.main,
|
|
|
|
padding: '2rem 4rem',
|
|
|
|
color: '#fff',
|
|
|
|
width: '100%',
|
|
|
|
},
|
|
|
|
container: {
|
|
|
|
height: '100%',
|
|
|
|
justifyContent: 'space-between',
|
|
|
|
},
|
|
|
|
}));
|
2020-10-04 20:27:52 +02:00
|
|
|
|
2021-03-30 15:14:02 +02:00
|
|
|
const Layout = ({ children, location }) => {
|
|
|
|
const muiStyles = useStyles();
|
|
|
|
|
|
|
|
return (
|
|
|
|
<>
|
|
|
|
<Header location={location} />
|
|
|
|
<Grid container className={muiStyles.container}>
|
|
|
|
<div className={classnames(styles.contentWrapper)}>
|
|
|
|
<Grid item className={styles.content} xs={12} sm={12}>
|
|
|
|
<div className={styles.contentContainer}>{children}</div>
|
|
|
|
<ErrorContainer />
|
2020-10-04 20:27:52 +02:00
|
|
|
</Grid>
|
2021-03-30 15:14:02 +02:00
|
|
|
</div>
|
|
|
|
<div className={muiStyles.footer}>
|
|
|
|
<Container>
|
|
|
|
<Footer />
|
|
|
|
</Container>
|
|
|
|
</div>
|
|
|
|
</Grid>
|
|
|
|
</>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
Layout.propTypes = {
|
|
|
|
location: PropTypes.object.isRequired,
|
|
|
|
};
|
|
|
|
|
|
|
|
export default Layout;
|