style logameal page

make logameal page more visual with a logo for the log a meal button. relates #17 and #4
FAC10 · May 23, 2017 · 9e99ecb · 9e99ecb
1 parent 41169a0
commit 9e99ecb
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 4 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/css/landing.css b/css/landing.css
@@ -35,4 +35,11 @@
 .logameal_button {
   background: silver;
   padding: .3em;
+  background: none;
+}
+
+.landing_greeting {
+  margin: .5em 2em;
+  font-size: 1em;
+  text-align: center;
 }
diff --git a/images/logameal.png b/images/logameal.png
diff --git a/landing.html b/landing.html
@@ -27,10 +27,8 @@
   </header>
 
   <div class="container">
-
-    <h1 class="landing_greeting">Hello, Kim.</h1>
-    <a href="logameal.html" class="logameal_button">Log a meal</a>
-
+    <a href="logameal.html" class="logameal_button"><img src="images/logameal.png" alt="Click here to log a meal"></a>
+    <h1 class="landing_greeting">Hi, Kim. <br>Would you like to log a meal?</h1>
   </div>
 
   <script src="landing.js"></script>