65 lines
1.6 KiB
JavaScript
65 lines
1.6 KiB
JavaScript
import * as React from "react"
|
|
import { Link as GatsbyLink } from "gatsby"
|
|
import { AppBar, Container, CssBaseline, Grid, Link, ThemeProvider, Toolbar } from "@mui/material"
|
|
import NavMenu from "./nav-menu"
|
|
import theme from "./theme"
|
|
import Footer from "./footer"
|
|
|
|
const Layout = ({ location, title, children }) => {
|
|
// const rootPath = `${__PATH_PREFIX__}/`
|
|
// const isRootPath = location.pathname === rootPath
|
|
// let header
|
|
|
|
// if (isRootPath) {
|
|
// header = (
|
|
// <h1 className="main-heading">
|
|
// <Link to="/">{title}</Link>
|
|
// </h1>
|
|
// )
|
|
// } else {
|
|
// header = (
|
|
// <Link className="header-link-home" to="/">
|
|
// {title}
|
|
// </Link>
|
|
// )
|
|
// }
|
|
|
|
return (
|
|
<>
|
|
<ThemeProvider theme={theme}>
|
|
<CssBaseline />
|
|
<AppBar
|
|
component="header"
|
|
color="transparent"
|
|
position="relative"
|
|
elevation={0}
|
|
>
|
|
<Toolbar>
|
|
<Link
|
|
underline="hover"
|
|
component={GatsbyLink}
|
|
to="/"
|
|
sx={{ textTransform: "lowercase" }}
|
|
>
|
|
{title}
|
|
</Link>
|
|
</Toolbar>
|
|
</AppBar>
|
|
<Container maxWidth="md" sx={{ py: 8 }}>
|
|
<Grid container spacing={2}>
|
|
<Grid item xs={12} md={3}>
|
|
<NavMenu location={location} />
|
|
</Grid>
|
|
<Grid item xs={12} md={9}>
|
|
<main>{children}</main>
|
|
</Grid>
|
|
</Grid>
|
|
</Container>
|
|
<Footer />
|
|
</ThemeProvider>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default Layout
|