50 lines
1.0 KiB
JavaScript
50 lines
1.0 KiB
JavaScript
import React, { Fragment } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import classnames from 'classnames';
|
|
|
|
import { makeStyles } from '@material-ui/core/styles';
|
|
import { CssBaseline } from '@material-ui/core';
|
|
import Navbar from './Navbar';
|
|
import Footer from './Footer';
|
|
|
|
const useStyles = makeStyles(theme => ({
|
|
main: {
|
|
minHeight: 'calc(100vh - 200px)',
|
|
paddingTop: theme.spacing(2),
|
|
paddingBottom: theme.spacing(3),
|
|
},
|
|
}));
|
|
|
|
const Layout = ({
|
|
children,
|
|
className,
|
|
navbarProps,
|
|
showNavbar,
|
|
showFooter,
|
|
}) => {
|
|
const classes = useStyles();
|
|
|
|
return (
|
|
<Fragment>
|
|
{showNavbar && <Navbar {...navbarProps} />}
|
|
<main className={classnames(className, classes.main)}>{children}</main>
|
|
{showFooter && <Footer />}
|
|
<CssBaseline />
|
|
</Fragment>
|
|
);
|
|
};
|
|
|
|
Layout.defaultProps = {
|
|
navbarProps: {},
|
|
showNavbar: true,
|
|
showFooter: true,
|
|
};
|
|
|
|
Layout.propTypes = {
|
|
children: PropTypes.node.isRequired,
|
|
showNavbar: PropTypes.bool.isRequired,
|
|
showFooter: PropTypes.bool.isRequired,
|
|
};
|
|
|
|
export default Layout;
|