src/pages/404.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

import * as React from "react";
import BlockLink from "../components/BlockLink";
import { BlockBody, BlockHeader, Content } from "../styles";

// markup
const NotFoundPage = (): React.ReactElement => {
  return (
    <main>
      <Content>
        <BlockHeader>Not found</BlockHeader>
        <BlockBody theme={{ padding: "4px 8px" }}>
          Sorry{" "}
          <span role="img" aria-label="Pensive emoji">
            😔
          </span>{" "}
          we couldn&apos;t find what you were looking for.
        </BlockBody>
        <BlockLink href="/" aria-label="Return to the front page">
          Home
        </BlockLink>
      </Content>
    </main>
  );
};

export default NotFoundPage;
export { Head } from "../components/SEO";