adds some css to the page and refactor handlabars code #25

FACN1 · May 15, 2017 · 058dc63 · 058dc63
1 parent 6c048a3
commit 058dc63
Show file tree

Hide file tree

Showing 8 changed files with 28 additions and 13 deletions.
diff --git a/.gitignore b/.gitignore
@@ -2,3 +2,4 @@ node_modules/
 npm-debug.log
 .eslintcache
 .eslintrc.json
+nodemon.json
diff --git a/public/style.css b/public/style.css
@@ -72,5 +72,16 @@ body {
 /* Car Route */
 
 #mapid {
-  height: 360px;
+  height: 80%;
+  width: 100%;
+  display: flex;
+}
+
+.arrived-button {
+  text-decoration: none;
+  color: white;
+}
+
+.back-button {
+  color: white;
 }
diff --git a/src/routes/carPage.js b/src/routes/carPage.js
@@ -1,7 +1,7 @@
 const carRouteHandler = (request, reply) => {
-  reply.view('carRoute', {
+  reply.view('car-route', {
     title: 'Private Parking',
-    address: 'ElMutran Parking',
+    tagLine: 'ElMutran Parking',
   });
 };
 

diff --git a/src/routes/home.js b/src/routes/home.js
@@ -2,6 +2,9 @@ module.exports = {
   method: 'GET',
   path: '/',
   handler: (request, reply) => {
-    reply.view('splash');
+    reply.view('splash', {
+      title: 'PAS',
+      tagLine: 'Park & Sleep',
+    });
   },
 };
diff --git a/src/views/car-route.hbs b/src/views/car-route.hbs
@@ -1,7 +1,10 @@
+<div class="app-shell">
+
   {{> header}}
   <div id="mapid"></div>
-  <a href="/walk">ARRIVED</a>
-  <img src="./images/arrow.png" alt="">
+  <a href="/walk" class="arrived-button">ARRIVED</a>
+  <i class="fa fa-arrow-left back-button"></i>
+</div>
 
 <script src="https://unpkg.com/[email protected]/dist/leaflet.js"
 integrity="sha512-A7vV8IFfih/D732iSSKi20u/ooOfj/AGehOKq0f4vLT1Zr2Y+RX7C+w8A1gaSasGtRUZpF/NZgzSAu4/Gc41Lg=="

diff --git a/src/views/layout/default.hbs b/src/views/layout/default.hbs
@@ -8,6 +8,7 @@
     integrity="sha512-07I2e+7D8p6he1SIM+1twR5TIrhUQn9+I6yjqD53JQjFiMf8EtC93ty0/5vJTZGF8aAocvHYNEDJajGdNx1IsQ=="
     crossorigin=""/>
     <link href="https://fonts.googleapis.com/css?family=Lora|Roboto+Condensed" rel="stylesheet">
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
     <title>PAS</title>
   </head>
   <body>

diff --git a/src/views/partials/header.hbs b/src/views/partials/header.hbs
@@ -1,2 +1,3 @@
-<h1>{{title}}</h1>
-<p>{{address}}</p>
+<h1 class="logo">{{title}}</h1>
+<div class="line-break"></div>
+<div class="tag-line"><p>{{tagLine}}</p></div>
diff --git a/src/views/splash.hbs b/src/views/splash.hbs
@@ -1,12 +1,7 @@
 
-<div class="app-shell">
-  <h1 class="logo">PAS</h1>
-  <div class="line-break"></div>
-  <div class="tag-line"><p>Park & Sleep</p></div>
   <p class="intro-text">Welcome! How will you be arriving?</p>
   <div class="button-container">
     <div class="splash-button"><img src="" alt=""></div>
     <div class="splash-button"><img src="" alt=""></div>
     <div class="splash-button"><img src="" alt=""></div>
   </div>
-</div>