1 files changed, 32 insertions, 4 deletions
diff --git a/src/components/mao-home.js b/src/components/mao-home.js
index 9f8daf4..7f43aa8 100644
--- a/src/components/mao-home.js
+++ b/src/components/mao-home.js
@@ -13,23 +13,36 @@ import { PageViewElement } from './page-view-element.js';
 
 // These are the shared styles needed by this element.
 import { SharedStyles } from './shared-styles.js';
+import { ButtonSharedStyles } from './button-shared-styles.js';
 
 // Import paper elements
 import '@polymer/paper-card/paper-card.js';
+import '@polymer/paper-button/paper-button.js';
 
 class MaoHome extends PageViewElement {
   _render(props) {
     return html`
     ${SharedStyles}
+    ${ButtonSharedStyles}
 
     <style>
       paper-card {
         width: 100%;
+        display: block;
+      }
+
+      .welcomeCard {
+        margin-top: 5px;
+        text-align: center;
+      }
+
+      .info {
+        font-weight: bold;
       }
 
       .home-grid {
         display: grid;
-        grid-gap: 1px;
+        grid-gap: 5px;
         grid-template-columns: 1fr;
       }
 
@@ -37,6 +50,7 @@ class MaoHome extends PageViewElement {
         .home-grid {
           grid-template-columns: 1fr 1fr;
         }
+      }
     </style>
 
       <section class="img-section">
@@ -68,7 +82,7 @@ class MaoHome extends PageViewElement {
                 Meeting Dates
               </h2>
               <p>
-                We will meet once a week on an undecided date.
+                We will meet once a week on <strong>D Day Flex</strong>.
               </p>
             </div>
 
@@ -76,13 +90,27 @@ class MaoHome extends PageViewElement {
               <div>
                 <h3>Upcoming Dates</h3>
                 <ul>
-                  <li>Club Presentations:\tSeptember 5th</li>
-                  <li>Club Fair (Sign Up!):\tSeptember 6th</li>
+                  <li>First Meeting:\tSeptember 12th</li>
                 </ul>
               </div>
             </div>
           </paper-card>
         </div>
+
+        <paper-card elevation=0 class='welcomeCard'>
+          <div class="card-content">
+            <h2 class="underline">
+              Welcome Letter
+            </h2>
+            <p>
+              Welcome Letters mark the beginning of each MAO year. Please read it and show it to your parents.
+            </p>
+          </div>
+          <div class="card-actions">
+            <a href="/#" target="_blank"><paper-button class="info" raised>Welcome Letter</paper-button></a>
+          </div>
+        </paper-card>
+
       </section>
     `;
   }