New top menu for desktop & mobile.

app/assets/stylesheets/frontend.scss

@@ -57,4 +57,14 @@ fieldset, .fieldset {
   display: inline-block;
   padding-left: 6px;
   padding-right: 6px;
+}
+
+.navbar-default {
+  .navbar-text {
+    width: 100%;
+    color: #000;
+    font-size: 150%;
+    margin-top: 10px;
+    margin-bottom: 10px;
+  }
 }

app/helpers/application_helper.rb

@@ -8,21 +8,27 @@ module ApplicationHelper
     link_to(name, '#', id: "add_#{association.to_s.singularize}" , class: "add_fields", data: {id: id, fields: fields.gsub("\n", "")})
   end
 
-  def top_menu(left, right = nil)
-    content_tag :div do
-      [
-        content_tag(:div, left, class: 'pull-left'),
-        content_tag(:div, right, class: 'pull-right'),
-        content_tag(:div, nil, class: 'clearfix'),
-      ].join.html_safe
+  def top_menu(right = nil)
+    content_tag :nav, class: 'navbar navbar-default' do
+      content_tag :div, class: 'container-fluid' do
+        content_tag :div, class: 'row' do
+          [
+            content_tag(:div, link_to_dashboard, class: 'col-xs-3'),
+            content_tag(:div, header_logo, class: 'col-xs-6'),
+            content_tag(:div, class: 'col-xs-3') { content_tag :div, right, class: 'pull-right' },
+          ].join.html_safe
+        end
+      end
     end
   end
 
   def link_to_dashboard
-    content_tag :p do
-      content_tag :a, href: root_path, class: 'btn btn-default', title: 'Back to dashboard' do
-        content_tag :span, '', class: 'glyphicon glyphicon-home'
-      end
+    link_to root_path, class: 'navbar-brand', title: 'Back to dashboard' do
+      content_tag :i, '', class: "glyphicon glyphicon-home"
     end
   end
+
+  def header_logo
+    content_tag :div, 'Velocipede', class: 'navbar-text text-center'
+  end
 end

app/views/bikes/new.html.haml

@@ -1,4 +1,4 @@
-= top_menu link_to_dashboard
+= top_menu
 
 %h1 Add Bike
 

app/views/bikes/show.html.haml

@@ -1,8 +1,10 @@
 - btn = if @show_add_bike
   - capture do
-    = link_to 'Add Another Bike?', new_bike_path, class: 'btn btn-default'
+    = link_to 'Add Another Bike?', new_bike_path, class: 'btn btn-default navbar-btn hidden-xs'
+    = link_to new_bike_path, class: 'navbar-brand visible-xs', title: 'Add Another Bike?' do
+      %i.glyphicon.glyphicon-plus
 
-= top_menu link_to_dashboard, btn
+= top_menu btn
 
 %h1 #{@bike.shop_id}: #{@bike.bike_brand}
 %h4= @bike.model

app/views/task_lists/edit.haml

@@ -1,4 +1,4 @@
-= top_menu link_to_dashboard
+= top_menu
 
 %h1 Task List
 

app/views/time_entries/index.haml

@@ -1,4 +1,4 @@
-= top_menu link_to_dashboard
+= top_menu
 
 %h1 Your Timesheet
 

app/views/time_entries/new.haml

@@ -1,4 +1,4 @@
-= top_menu link_to_dashboard
+= top_menu
 
 %h1 Add Time Entry
 - time = Time.now