make page a React components

components/Page.js

@@ -3,24 +3,31 @@ import Meta from './Meta'
 import Header from './Header'
 import Footer from './Footer'
 
-export default ({ children, enableHeroText }) => (
+class Page extends React.Component {
-  <main className="main mt4 mb4">
+  render() {
-    <Meta />
+    const { children, enableHeroText } = this.props
-    <Header enableHeroText={enableHeroText} />
+    return (
-    <div className="page">{children}</div>
+      <main className="main mt4 mb4">
+        <Meta />
+        <Header enableHeroText={enableHeroText} />
+        <div className="page">{children}</div>
 
-    <Footer />
+        <Footer />
 
-    <style jsx>
+        <style jsx>
-      {`
+          {`
-        .main {
+            .main {
-          display: flex;
+              display: flex;
-          justify-content: center;
+              justify-content: center;
-          flex-direction: column;
+              flex-direction: column;
-          align-items: center;
+              align-items: center;
-          min-width: 1080px; // temporary fix for mobile overflow issue
+              min-width: 1080px; // temporary fix for mobile overflow issue
-        }
+            }
-      `}
+          `}
-    </style>
+        </style>
-  </main>
+      </main>
-)
+    )
+  }
+}
+
+export default Page