fix 404 page
This commit is contained in:
parent
e552393a30
commit
ef7f75d768
|
@ -21,7 +21,14 @@ const useStyles = makeStyles(theme => ({
|
|||
},
|
||||
}));
|
||||
|
||||
const Layout = ({ children, className, lang, pathname }) => {
|
||||
const Layout = ({
|
||||
children,
|
||||
className,
|
||||
lang,
|
||||
pathname,
|
||||
showHeader,
|
||||
showFooter,
|
||||
}) => {
|
||||
const classes = useStyles();
|
||||
const { site } = useStaticQuery(
|
||||
graphql`
|
||||
|
@ -39,28 +46,37 @@ const Layout = ({ children, className, lang, pathname }) => {
|
|||
|
||||
return (
|
||||
<ThemeProvider theme={theme}>
|
||||
{showHeader && (
|
||||
<Header
|
||||
twhelpUrl={site.siteMetadata.twhelpUrl}
|
||||
languages={site.siteMetadata.languages}
|
||||
lang={lang}
|
||||
pathname={pathname}
|
||||
/>
|
||||
)}
|
||||
<main
|
||||
className={className ? classes.main + " " + className : classes.main}
|
||||
>
|
||||
<div className={classes.mainChild}>{children}</div>
|
||||
</main>
|
||||
<Footer title={site.siteMetadata.title} lang={lang} />
|
||||
{showFooter && <Footer title={site.siteMetadata.title} lang={lang} />}
|
||||
<CssBaseline />
|
||||
</ThemeProvider>
|
||||
);
|
||||
};
|
||||
|
||||
Layout.defaultProps = {
|
||||
showHeader: true,
|
||||
showFooter: true,
|
||||
};
|
||||
|
||||
Layout.propTypes = {
|
||||
children: PropTypes.node.isRequired,
|
||||
className: PropTypes.string,
|
||||
lang: PropTypes.string.isRequired,
|
||||
pathname: PropTypes.string.isRequired,
|
||||
showHeader: PropTypes.bool.isRequired,
|
||||
showFooter: PropTypes.bool.isRequired,
|
||||
};
|
||||
|
||||
export default Layout;
|
||||
|
|
|
@ -2,6 +2,7 @@ import React from "react";
|
|||
|
||||
import { makeStyles } from "@material-ui/core/styles";
|
||||
import { Container, Typography } from "@material-ui/core";
|
||||
import { Link } from "gatsby-theme-material-ui";
|
||||
import Layout from "@components/Layout/Layout";
|
||||
import SEO from "@components/SEO";
|
||||
|
||||
|
@ -14,16 +15,29 @@ const useStyles = makeStyles(() => ({
|
|||
},
|
||||
}));
|
||||
|
||||
const NotFoundPage = ({ location }) => {
|
||||
const NotFoundPage = ({ location, pageContext }) => {
|
||||
const classes = useStyles();
|
||||
|
||||
return (
|
||||
<Layout>
|
||||
<Layout
|
||||
showHeader={false}
|
||||
showFooter={false}
|
||||
lang={pageContext.langKey}
|
||||
pathname={location.pathname}
|
||||
>
|
||||
<SEO title="404: Not found" location={location.pathname} />
|
||||
<Container className={classes.container}>
|
||||
<Typography variant="h1">404</Typography>
|
||||
<Typography variant="h3">
|
||||
You just hit a route that doesn't exist.
|
||||
<Typography gutterBottom variant="h1">
|
||||
Page Not Found
|
||||
</Typography>
|
||||
<Typography gutterBottom variant="h4">
|
||||
Looks like you've followed a broken link or entered a URL that doesn't
|
||||
exist on this site.
|
||||
</Typography>
|
||||
<Typography variant="h4">
|
||||
<Link color="secondary" to="/">
|
||||
Back to our site
|
||||
</Link>
|
||||
</Typography>
|
||||
</Container>
|
||||
</Layout>
|
||||
|
|
Reference in New Issue
Block a user