application nav WIP

app/assets/stylesheets/application.css

@@ -9,12 +9,30 @@
  * compiled file, but it's generally better to create a new file per style scope.
  *
  *= require_self
- *= require datepicker
  *= require bootstrap
+ *= require datepicker
  *= require bootstrap-timepicker
  *= require bootstrap_and_overrides
 */
 
+* {
+	-webkit-box-sizing: border-box;
+	-moz-box-sizing: border-box;
+	box-sizing: border-box;
+	margin: 0;
+}
+
+body {
+  background-color: #fff;
+  color: #333;
+  font-size: 13px;
+  line-height: 18px;
+}
+
+.x-boundlist-item {
+  white-space: nowrap;
+}
+
 .container {
 	max-width: 940px;
 	margin: 0 auto;
@@ -30,6 +48,10 @@ p {
 	padding: 20px 0;
 }
 
+a {
+text-decoration: none;
+}
+
 .check_box {
 	width: 30px;
 	height: 30px;
@@ -38,4 +60,37 @@ p {
 
 label {
 	font-size: x-large;
+}
+
+/* navigation styling */
+
+.navbar-default {
+  background-color: #428bca;
+  border-color: #428bca;
+	border-radius: 0px;
+}
+
+.navbar > .container-fluid .navbar-brand {
+margin-left: -15px;
+}
+
+.navbar-default .navbar-brand {
+  color: #ffffff;
+}
+
+.navbar-default .navbar-nav > li > a {
+  color: #ffffff;
+  list-style: none;
+}
+
+.navbar-brand {
+	float: left;
+	padding: 15px 15px;
+	font-size: 18px;
+	line-height: 20px;
+	height: 50px;
+}
+
+.navbar-default a:hover {
+  color: #d1b84a !important;
 }

app/assets/stylesheets/bootstrap_and_overrides.css.scss

@@ -1,9 +1,3 @@
-body { 
-	padding-top: 60px;
-	padding-left: 20px;
-}
-
-
 // Set the correct sprite paths
 $iconSpritePath: asset-path('twitter/bootstrap/glyphicons-halflings.png');
 $iconWhiteSpritePath: asset-path('twitter/bootstrap/glyphicons-halflings-white.png');

app/controllers/application_controller.rb

@@ -1,5 +1,7 @@
 class ApplicationController < ActionController::Base
   before_filter :authenticate_user!
   protect_from_forgery
+
+  layout 'application'
   
 end

app/views/layouts/application.html.haml

@@ -5,31 +5,47 @@
     %meta{ name: "viewport", content: "width=device-width", "initial-scale" => "1.0"}
     %title= content_for?(:title) ? yield(:title) : "Velocipede"
     = csrf_meta_tags
-    = stylesheet_link_tag "bootstrap_and_overrides", "datepicker", "bootstrap-timepicker", :media => "all"
+    = stylesheet_link_tag "bootstrap", "application", :media => "all"
     /[if lt IE 9]
       = javascript_include_tag "http://html5shim.googlecode.com/svn/trunk/html5.js"
-    :css
-      body {
-        padding-top: 5px;
-      }
-      .x-boundlist-item {
-        white-space: nowrap;
-      }
-
+      
   %body
-    .container
+    %nav{class: "navbar navbar-default", role: "navigation"}
+      %div{class: "container-fluid"}
+      /[Brand and toggle get grouped for better mobile display]
+        %div{class: "navbar-header"}
+          %button{type: "button", class: "navbar-toggle", 'data-toggle' => "collapse", 'data-target' => "#bs-example-navbar-collapse-1"}
+            %span{class: "sr-only"} Toggle navigation
+            %span.icon-bar
+            %span.icon-bar
+            %span.icon-bar
+          %a{class:"navbar-brand", href:"/"}
+          = image_tag 'velo_logo.png'
 
-      .content
-        - if flash[:notice]
-          %p{:class => 'notice'}= flash[:notice]
-        - if flash[:alert]
-          %p{:class => 'alert'}= flash[:alert]
-        .row
-          .span12
-            = yield
+        /[Collect the nav links, forms, and other content for toggling]
+        %div{class: "collapse navbar-collapse", id:"bs-example-navbar-collapse-1"}
+          %ul{class: "nav navbar-nav"}
+            %li
+              %a{href: new_time_entry_path} Add Time Entry
+            %li
+              %a{href: time_entries_path} View Timesheet
+            %li
+              %a{href: new_bike_path} Add Bike
+            %li
+              %a{href: bike_path(@bike)} View Your Bike
+          %ul{class: "nav navbar-nav navbar-right"}
+          - if user_signed_in?
+            %li
+              %input{id: "index_logout", value: "Logout", "data-url" => destroy_user_session_path }
+
+    .container
+      - if flash[:notice]
+        %p{:class => 'notice'}= flash[:notice]
+      - if flash[:alert]
+        %p{:class => 'alert'}= flash[:alert]
 
-      %footer
-        %p © BikeShed #{Time.now.year}
+    %footer
+      %p © BikeShed #{Time.now.year}
 
     = javascript_include_tag "application"
     = javascript_include_tag params[:controller] 

app/views/site/index.html.haml

@@ -1,21 +0,0 @@
-= stylesheet_link_tag "bootstrap_and_overrides", :media => "all"
-%h2 Dashboard
-
-%p
-  %p
-    %a{class: "btn btn-lg btn-block btn-primary", href: new_time_entry_path} Add Time Entry
-  %p
-    %a{class: "btn btn-lg btn-block btn-primary", href: time_entries_path} View Timesheet
-- if can? :manage, Bike
-  %p
-    %a{class: "btn btn-lg btn-block btn-primary", href: new_bike_path} Add Bike
-
-- if !@bike.nil?
-  %p
-    %a{class: "btn btn-lg btn-block btn-primary", href: bike_path(@bike)} View Your Bike
-
-%p
-  %p
-    %a{class: "btn btn-lg btn-block btn-primary hidden-xs", href: admin_index_path} Desktop View
-  %p
-    %input{id: "index_logout", value: "Logout", type: "button", class: "btn btn-lg btn-block btn-danger", "data-url" => destroy_user_session_path }