From 55fea809fc018653dc956d18a6c6e4205a95ed98 Mon Sep 17 00:00:00 2001
From: LeftoverLemon59 <rennichs1@central.edu>
Date: Sat, 7 Mar 2020 13:51:58 -0600
Subject: [PATCH] Thank you page (#24)

* centered content

* updated thank you page

* updated thank you

* updated thank you page
---
 constants.js                |  7 +++++++
 src/pages/contact/index.js  | 17 ++++++-----------
 src/pages/contact/thanks.js | 23 +++++++++++++++++++----
 3 files changed, 32 insertions(+), 15 deletions(-)
 create mode 100644 constants.js

diff --git a/constants.js b/constants.js
new file mode 100644
index 0000000..4a39715
--- /dev/null
+++ b/constants.js
@@ -0,0 +1,7 @@
+module.exports = {
+    facebook: 'https://www.facebook.com/Pi515/',
+    twitter: 'https://twitter.com/LOVEPI515',
+    phoneNumber: '515-344-4326',
+    address: '4300 Beaver Avenue Des Moines, IA 50310',
+    email: 'tech@pi515.org'
+}
\ No newline at end of file
diff --git a/src/pages/contact/index.js b/src/pages/contact/index.js
index 1b17e63..26f6753 100644
--- a/src/pages/contact/index.js
+++ b/src/pages/contact/index.js
@@ -1,6 +1,7 @@
 import React from 'react'
 import { navigate } from 'gatsby-link'
 import Layout from '../../components/Layout'
+import constants from '../../../constants'
 
 function encode(data) {
   return Object.keys(data)
@@ -9,12 +10,6 @@ function encode(data) {
 }
 
 export default class Index extends React.Component {
-  facebook = 'https://www.facebook.com/Pi515/';
-  twitter = 'https://twitter.com/LOVEPI515';
-  phoneNumber = '515-344-4326';
-  address = '4300 Beaver Avenue Des Moines, IA 50310';
-  email = 'tech@pi515.org';
-
   constructor(props) {
     super(props);
     this.state = { isValidated: false }
@@ -46,13 +41,13 @@ export default class Index extends React.Component {
           <div className="container columns is-mobile">
             <address className="content column">
               <h3>Pursuit of Innovation</h3>
-              <div>Phone number: <a href={'tel:' + this.phoneNumber}>{this.phoneNumber}</a></div>
-              <div>Email: <a href={'mailto:' + this.email}>{this.email}</a></div>
-              <div>Address: <a href={'geo:' + this.address}>4300 Beaver Avenue Des Moines, IA 50310</a></div>
+              <div>Phone number: <a href={'tel:' + constants.phoneNumber}>{constants.phoneNumber}</a></div>
+              <div>Email: <a href={'mailto:' + constants.email}>{constants.email}</a></div>
+              <div>Address: <a href={'geo:' + constants.address}>{constants.address}</a></div>
               <div>Hours: 9am - 5pm</div>
               <div>
-                <div><a href={this.facebook}>Facebook</a></div>
-                <div><a href={this.twitter}>Twitter</a></div>
+                <div><a href={constants.facebook}>Facebook</a></div>
+                <div><a href={constants.twitter}>Twitter</a></div>
               </div>
               <iframe
                 title="map"
diff --git a/src/pages/contact/thanks.js b/src/pages/contact/thanks.js
index b07926c..af7a57c 100644
--- a/src/pages/contact/thanks.js
+++ b/src/pages/contact/thanks.js
@@ -1,13 +1,28 @@
 import React from 'react'
 import Layout from '../../components/Layout'
+import constants from '../../../constants'
 
 export default () => (
   <Layout>
     <section className="section">
-      <div className="container">
-        <div className="content">
-          <h1>Thank you!</h1>
-          <p>This is a custom thank you page for form submissions</p>
+      <div className="columns is-centered is-vcentered">
+        <div class="column is-half has-text-centered">
+          <div className="content">
+            <h1>Thanks for being Awesome!</h1>
+            <p>
+              We appreciate that you've taken the time to write us. If your
+              inquiry is urgent, please use the telephone number listed below to talk to one
+              of our staff members. Otherwise, we will reply by email as soon as possible.
+              <br/><br/>
+              Talk to you soon!
+            </p>
+          </div>
+          <address className="content column">
+            <h3>Pursuit of Innovation</h3>
+            <div>Phone number: <a href={'tel:' + constants.phoneNumber}>{constants.phoneNumber}</a></div>
+            <div>Email: <a href={'mailto:' + constants.email}>{constants.email}</a></div>
+            <div>Address: <a href={'geo:' + constants.address}>{constants.address}</a></div>
+          </address>
         </div>
       </div>
     </section>