From f2cf6cf154deaae6572d506205086d1029d4167f Mon Sep 17 00:00:00 2001
From: s-egge <102624422+s-egge@users.noreply.github.com>
Date: Wed, 3 Jan 2024 10:45:53 -0800
Subject: [PATCH] Changed contact info from email to OSU fa contact page (#291)

* Changed contact info from email to OSU fa contact page

* 1 column

---------

Co-authored-by: solderq35 <solderq35@gmail.com>
---
 src/components/extras/contact.vue  | 41 ++++++++++++++++++++++--------
 src/components/get_started/faq.vue |  4 +--
 2 files changed, 32 insertions(+), 13 deletions(-)

diff --git a/src/components/extras/contact.vue b/src/components/extras/contact.vue
index 84898a0f..bc96f982 100644
--- a/src/components/extras/contact.vue
+++ b/src/components/extras/contact.vue
@@ -6,10 +6,15 @@
       <div class="center">
         <div class="contact-div">
           <p class="body">
-            Please email us at
-            <a href="mailto:sustainability@oregonstate.edu">sustainability@oregonstate.edu</a>
-            for feedback or questions, or check our
-            <a href="/#/getstarted">FAQ</a>
+            <el-row :gutter="20">
+              <el-col :xs="16" :sm="16" :md="16" :lg="16" :xl="16">
+                <a href="https://fa.oregonstate.edu/contact">Contact us here</a>
+                with your comments and questions. Be sure to select "Sustainability Office" from the Category drop-down
+                menu. You can also check out our
+                <a href="/#/getstarted">FAQ</a>
+                <el-image class="demo-visual" :src="contactDemo"></el-image>
+              </el-col>
+            </el-row>
           </p>
         </div>
       </div>
@@ -20,7 +25,11 @@
 export default {
   name: 'contact',
   props: [],
-  data () {},
+  data () {
+    return {
+      contactDemo: 'https://energy-dashboard.s3-us-west-2.amazonaws.com/images/contactImage.png'
+    }
+  },
   watch: {},
   mounted () {},
   methods: {}
@@ -29,7 +38,6 @@ export default {
 <style lang="scss" scoped>
 .cont {
   text-align: center;
-  padding-top: 10%;
 }
 .title {
   font-size: 80px;
@@ -40,14 +48,25 @@ export default {
   font-size: 28px;
   color: black;
 }
-.contact-div {
-  max-width: 800px;
-}
+
 .center {
   margin: auto;
-  width: 50%;
-  padding: 10px;
+  width: 75%;
+  padding: 20px;
+}
+.demo-visual {
+  height: 100%;
+  width: auto;
+  box-shadow: rgba(0, 0, 0, 0.19) 0px 6px 8px;
+}
+
+.el-row {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-align: left;
 }
+
 @media only screen and (max-width: 600px) {
   .center {
     width: 80%;
diff --git a/src/components/get_started/faq.vue b/src/components/get_started/faq.vue
index 3afd9725..dd0668f5 100644
--- a/src/components/get_started/faq.vue
+++ b/src/components/get_started/faq.vue
@@ -27,8 +27,8 @@
     </el-collapse-item>
     <el-collapse-item title="How can I submit questions or feedback?" name="7">
       <div>
-        Please email us at
-        <a href="mailto:sustainability@oregonstate.edu">sustainability@oregonstate.edu</a>.
+        Check out our
+        <a href="/#/contact">contact page.</a>
       </div>
     </el-collapse-item>
   </el-collapse>