update layout
This commit is contained in:
parent
d39c88f21b
commit
51cd50dcc3
@ -1,35 +1,54 @@
|
|||||||
import * as React from "react"
|
import * as React from "react"
|
||||||
import { Link } from "gatsby"
|
import { Link as GatsbyLink } from "gatsby"
|
||||||
|
import { AppBar, Button, Container, Link, Toolbar } from "@mui/material"
|
||||||
|
|
||||||
const Layout = ({ location, title, children }) => {
|
const Layout = ({ location, title, children }) => {
|
||||||
const rootPath = `${__PATH_PREFIX__}/`
|
// const rootPath = `${__PATH_PREFIX__}/`
|
||||||
const isRootPath = location.pathname === rootPath
|
// const isRootPath = location.pathname === rootPath
|
||||||
let header
|
// let header
|
||||||
|
|
||||||
if (isRootPath) {
|
// if (isRootPath) {
|
||||||
header = (
|
// header = (
|
||||||
<h1 className="main-heading">
|
// <h1 className="main-heading">
|
||||||
<Link to="/">{title}</Link>
|
// <Link to="/">{title}</Link>
|
||||||
</h1>
|
// </h1>
|
||||||
)
|
// )
|
||||||
} else {
|
// } else {
|
||||||
header = (
|
// header = (
|
||||||
<Link className="header-link-home" to="/">
|
// <Link className="header-link-home" to="/">
|
||||||
{title}
|
// {title}
|
||||||
</Link>
|
// </Link>
|
||||||
)
|
// )
|
||||||
}
|
// }
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="global-wrapper" data-is-root-path={isRootPath}>
|
<>
|
||||||
<header className="global-header">{header}</header>
|
<AppBar
|
||||||
|
component="header"
|
||||||
|
color="transparent"
|
||||||
|
position="relative"
|
||||||
|
elevation={0}
|
||||||
|
>
|
||||||
|
<Toolbar>
|
||||||
|
<Link
|
||||||
|
underline="hover"
|
||||||
|
component={GatsbyLink}
|
||||||
|
to="/"
|
||||||
|
sx={{ textTransform: "lowercase" }}
|
||||||
|
>
|
||||||
|
{title}
|
||||||
|
</Link>
|
||||||
|
</Toolbar>
|
||||||
|
</AppBar>
|
||||||
|
<Container>
|
||||||
<main>{children}</main>
|
<main>{children}</main>
|
||||||
<footer>
|
<footer>
|
||||||
© {new Date().getFullYear()}, Built with
|
© {new Date().getFullYear()}, Built with
|
||||||
{` `}
|
{` `}
|
||||||
<a href="https://www.gatsbyjs.com">Gatsby</a>
|
<a href="https://www.gatsbyjs.com">Gatsby</a>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</Container>
|
||||||
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user