Add 404 page-not-found fallback [Fixes #155] (#176)

* add 404 page not found fallback

* clean up styling

src/constants.ts

@@ -163,7 +163,9 @@ export const METADATA = {
   HOME_DESCRIPTION:
     'Go-ethereum website, home for the official Golang execution layer implementation of the Ethereum protocol',
   DOWNLOADS_TITLE: 'Downloads',
-  DOWNLOADS_DESCRIPTION: 'All Geth releases and builds, available for download'
+  DOWNLOADS_DESCRIPTION: 'All Geth releases and builds, available for download',
+  PAGE_404_TITLE: '404 - Page not found',
+  PAGE_404_DESCRIPTION: 'The page you are looking for does not exist'
 };
 
 // GitHub urls

src/pages/404.tsx

@@ -0,0 +1,49 @@
+import { Button, Flex, Text } from '@chakra-ui/react';
+import type { NextPage } from 'next';
+import NextLink from 'next/link';
+
+import { GopherHomeFront } from '../components/UI/svgs';
+import { PageMetadata } from '../components/UI';
+
+import { METADATA} from '../constants';
+
+const Page404NotFound: NextPage = ({}) => {
+  return (
+    <>
+      <PageMetadata title={METADATA.PAGE_404_TITLE} description={METADATA.PAGE_404_DESCRIPTION} />
+
+      <main id='main-content'>
+        <Flex direction='column' alignItems='center' py={{ base: 16, md: 24 }} border="2px" borderColor="primary">
+          <GopherHomeFront />
+          <Text
+            fontSize={{ base: "8xl", md: "9xl" }}
+            lineHeight='120%'
+            fontFamily='heading'
+            textAlign='center'
+            letterSpacing='0.05em'
+            fontWeight='500'
+          >
+            404
+          </Text>
+          <Text
+            fontSize={{ base: 'xl', md: '2xl'}}
+            fontFamily='heading'
+            fontWeight='700'
+            textAlign='center'
+            mb={{ base: 8, md: 12 }}
+            letterSpacing='0.05em'
+          >
+            page not found
+          </Text>
+          <NextLink href='/' passHref legacyBehavior>
+            <Button variant='primary' as='a' data-group>
+              <Text textStyle='homepage-primary-label'>Go to homepage</Text>
+            </Button>
+          </NextLink>
+        </Flex>
+      </main>
+    </>
+  );
+};
+
+export default Page404NotFound;