From 2bf758b27dc219747964618ad232401ab46c7540 Mon Sep 17 00:00:00 2001
From: Dmitriy An <dmitriym44@gmail.com>
Date: Tue, 25 Feb 2020 15:20:49 +0100
Subject: [PATCH] Fix 404 page styling

---
 src/pages/404.js | 52 +++++++++++++++++++++++-------------------------
 1 file changed, 25 insertions(+), 27 deletions(-)

diff --git a/src/pages/404.js b/src/pages/404.js
index 098b479d..6a2763e6 100644
--- a/src/pages/404.js
+++ b/src/pages/404.js
@@ -2,33 +2,31 @@ import React from 'react';
 import { Heading, Text, TextContainer } from '../components/shared/Typography';
 
 const NotFoundPage = () => (
-  <TextContainer>
-    <div
-      style={{
-        display: 'flex',
-        justifyContent: 'center',
-        alignItems: 'center'
-      }}
-    >
-      <Heading>Whoops - That Page Doesn’t Exist (404)</Heading>
-      <Text>
-        Looks like the page you requested either doesn’t exist or has been
-        moved. If you think this is an error or ended up at this page by
-        following a link, please{' '}
-        <a href="https://github.com/gatsbyjs/gatsby/issues/new">
-          open an issue
-        </a>{' '}
-        to let us know.
-      </Text>
-      <Text>
-        {' '}
-        <a href="https://store.gatsbyjs.org/">Gatsby Store Home page</a>{' '}
-        <a href="https://www.gatsbyjs.org/">Gatsby Home</a>{' '}
-        <a href="https://github.com/gatsbyjs/store.gatsbyjs.org">
-          Gatsby Github Page
-        </a>{' '}
-      </Text>
-    </div>
+  <TextContainer
+    style={{
+      flex: 1,
+      display: 'flex',
+      flexDirection: 'column',
+      alignItems: 'center',
+      justifyContent: 'center'
+    }}
+  >
+    <Heading>Whoops - That Page Doesn’t Exist (404)</Heading>
+    <Text>
+      Looks like the page you requested either doesn’t exist or has been moved.
+      If you think this is an error or ended up at this page by following a
+      link, please{' '}
+      <a href="https://github.com/gatsbyjs/gatsby/issues/new">open an issue</a>{' '}
+      to let us know.
+    </Text>
+    <Text>
+      {' '}
+      <a href="https://store.gatsbyjs.org/">Gatsby Store Home page</a>{' '}
+      <a href="https://www.gatsbyjs.org/">Gatsby Home</a>{' '}
+      <a href="https://github.com/gatsbyjs/store.gatsbyjs.org">
+        Gatsby Github Page
+      </a>{' '}
+    </Text>
   </TextContainer>
 );