feat(dashboard-v2): add custom 404 page

This commit is contained in:
Michał Leszczyk 2022-04-15 17:02:49 +02:00
parent 910270bca4
commit 3ed20e670b
No known key found for this signature in database
GPG Key ID: FA123CA8BAA2FBF4
1 changed files with 17 additions and 44 deletions

View File

@ -1,54 +1,27 @@
import * as React from "react"; import * as React from "react";
import { Link } from "gatsby";
// styles import DashboardLayout from "../layouts/DashboardLayout";
const pageStyles = {
color: "#232129",
padding: "96px",
fontFamily: "-apple-system, Roboto, sans-serif, serif",
};
const headingStyles = {
marginTop: 0,
marginBottom: 64,
maxWidth: 320,
};
const paragraphStyles = { import { Metadata } from "../components/Metadata";
marginBottom: 48, import HighlightedLink from "../components/HighlightedLink";
};
const codeStyles = {
color: "#8A6534",
padding: 4,
backgroundColor: "#FFF4DB",
fontSize: "1.25rem",
borderRadius: 4,
};
// markup
const NotFoundPage = () => { const NotFoundPage = () => {
return ( return (
<main style={pageStyles}> <div>
<title>Not found</title> <Metadata>
<h1 style={headingStyles}>Page not found</h1> <title>Not found</title>
<p style={paragraphStyles}> </Metadata>
Sorry{" "} <section className="mt-12">
<span role="img" aria-label="Pensive emoji"> <h1>Oops! 😔</h1>
😔 <p>Whatever you're looking for is not here.</p>
</span>{" "} <p>
we couldnt find what you were looking for. Would you like to <HighlightedLink to="/">go back to homepage</HighlightedLink>?
<br /> </p>
{process.env.NODE_ENV === "development" ? ( </section>
<> </div>
<br />
Try creating a page in <code style={codeStyles}>src/pages/</code>.
<br />
</>
) : null}
<br />
<Link to="/">Go home</Link>.
</p>
</main>
); );
}; };
NotFoundPage.Layout = DashboardLayout;
export default NotFoundPage; export default NotFoundPage;