header and footer

assets/linker/styles/app.less

@@ -1,30 +1,25 @@
+@footer-height: 52px;
+
 html {
     position: relative;
     min-height: 100%;
 }
 body {
     background-color: #fff;
-    margin-bottom: 40px;
+    margin-bottom: @footer-height;
-}
-header.page-header {
-    border-bottom-color: #ddd;
-    margin: 0;
 }
 #page {
-    padding-bottom: 30px;
+    padding-bottom: 20px;
-    #main-cell {
-        display: table-cell;
-        vertical-align: middle;
-    }
 }
-#footer {
+footer {
     position: absolute;
     bottom: 0;
     width: 100%;
-    height: 40px;
+    height: @footer-height;
-    background-color: #fff;
+    overflow: hidden;
-    border-top: 1px solid #333;
+    .navbar {
-    box-shadow: 0 0 10px 0 #333;
+        border-radius: 0;
+    }
 }
 .create-run-form {
 }

views/footer.jade

@@ -0,0 +1,13 @@
+footer
+    .navbar.navbar-inverse
+        .container
+            nav
+                ul.nav.navbar-nav.pull-left
+                    li 
+                        a(href='/about') about
+                    li
+                        a(href='/privacy-policy') privacy policy
+                    li
+                        a(href='/how-we-use-your-info') how we use your info
+            p.photo-credits.pull-right.navbar-text
+                | All background photos are © Elaine Davis

views/header.jade

@@ -0,0 +1,4 @@
+header.navbar.navbar-inverse.navbar-static-top
+    .container
+        a.navbar-brand(href='/') lunch run me
+        small.navbar-text ...where lunch runs are fun

views/layout.jade

@@ -17,14 +17,10 @@ html(lang="en",ng-app="lunchApp")
         <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
         <![endif]-->
     body(ng-controller="BodyCtrl")
+        include header
         #page.container
-            #main-cell
+            div(ng-view)
-                header.page-header
+        include footer
-                    h1.text-center Lunch Run Me!
-                        small &nbsp;...where lunch runs are fun
-
-                div(ng-view)
-        #footer hello there!
 
         // TEMPLATES