improve ui for bike display & edit pages

app/views/bikes/_fields.html.erb

@@ -2,81 +2,80 @@
 
 <div class="form-group">
   <%= f.label "Bike Entry Date:", class: "col-sm-2 control-label" %>
-  <div class="col-sm-6">
-    <%= f.text_field :entry_date, class: "form-control datepicker", disabled: disabled %>
+  <div class="col-sm-10">
+    <%= f.text_field :entry_date, class: "form-control", disabled: disabled %>
   </div>
 </div>
 
 <div class="form-group">
   <%= f.label "Brand:", class: "col-sm-2 control-label"   %>
-  <div class="col-sm-6">
+  <div class="col-sm-10">
     <%= f.text_field :brand, class: "form-control", disabled: disabled %>
   </div>
 </div>
 
 <div class="form-group">
   <%= f.label "Model:", class: "col-sm-2 control-label" %>
-
-  <div class="col-sm-6">
+  <div class="col-sm-10">
     <%= f.text_field :model, class: "form-control", disabled: disabled %>
   </div>
 </div>
 
 <div class="form-group">
   <%= f.label "Type:", class: "col-sm-2 control-label" %>
-  <div class="col-sm-6">
+  <div class="col-sm-10">
     <%= f.text_field :bike_type, class: "form-control", disabled: disabled %>
   </div>
 </div>
 
 <div class="form-group">
   <%= f.label "Freecyclery?", class: "col-sm-offset-2 control-label" %>
-    <%= f.check_box :freecyclery, disabled: disabled %>
+  <%= f.check_box :freecyclery, disabled: disabled %>
 </div>
 
 <div class="form-group">
   <%= f.label "Sale?", class: "col-sm-offset-2 control-label" %>
-    <%= f.check_box :sale, disabled: disabled  %>
+  <%= f.check_box :sale, disabled: disabled  %>
 </div>
 
 <div class="form-group">
   <%= f.label "Serial Number", class: "col-sm-2 control-label" %>
-  <div class="col-sm-6">
+  <div class="col-sm-10">
     <%= f.text_field :serial_number, class: "form-control", disabled: disabled  %>
   </div>
 </div>
 
 <div class="form-group">
   <%= f.label "Notes", class: "col-sm-2 control-label" %>
-  <div class="col-sm-6">
+  <div class="col-sm-10">
     <%= f.text_area :notes, class: "form-control", disabled: disabled  %>
   </div>
 </div>
 
 <div class="form-group">
   <%= f.label "Tag Info", class: "col-sm-2 control-label" %>
-  <div class="col-sm-6">
+  <div class="col-sm-10">
     <%= f.text_area :tag_info, class: "form-control", disabled: disabled  %>
   </div>
 </div>
 
 <div class="form-group">
   <%= f.label "Repaired by:", class: "col-sm-2 control-label" %>
-  <div class="col-sm-6">
+  <div class="col-sm-10">
     <%= f.text_field :repaired_by, class: "form-control", disabled: disabled  %>
   </div>
 </div>
 
 <div class="form-group">
   <%= f.label "Completion Date:", class: "col-sm-2 control-label" %>
-  <div class="col-sm-6">
+  <div class="col-sm-10">
     <%= f.text_field :completion_date, class: "form-control datepicker", disabled: disabled  %>
   </div>
 </div>
 
 <div class="form-group">
   <%= f.label "Price", class: "col-sm-2 control-label" %>
-  <div class="col-sm-6">
+  <div class="col-sm-10">
     <%= f.text_field :price, class: "form-control", disabled: disabled  %>
   </div>
 </div>

app/views/bikes/_form.html.erb

@@ -1,19 +1,23 @@
-<%= form_for @bike, html: {class: 'form-horizontal'} do |f| %>
-  <% if @bike.errors.any? %>
-    <div id="error_explanation">
-      <h2><%= pluralize(@bike.errors.count, "error") %> prohibited this bike from being saved:</h2>
+<div class="container">
+  <%= form_for @bike, html: {class: 'form-horizontal'} do |f| %>
+    <% if @bike.errors.any? %>
+      <div id="error_explanation">
+        <h2><%= pluralize(@bike.errors.count, "error") %> prohibited this bike from being saved:</h2>
   
-      <ul>
-      <% @bike.errors.full_messages.each do |msg| %>
-        <li><%= msg %></li>
-      <% end %>
-      </ul>
-    </div>
-  <% end %>
+        <ul>
+        <% @bike.errors.full_messages.each do |msg| %>
+          <li><%= msg %></li>
+        <% end %>
+        </ul>
+      </div>
+    <% end %>
   
-  <%= render 'fields', f: f %>
+    <%= render 'fields', f: f %>
   
-  <div class="actions col-sm-offset-2">
-    <%= f.submit class: "btn btn-default" %>
-  </div>
-<% end %>
+    <div class="row">
+      <div class="actions col-sm-offset-2">
+        <%= f.submit class: "btn btn-default" %>
+      </div>
+    </div>
+  <% end %>
+</div>

app/views/bikes/edit.html.erb

@@ -1,6 +1,8 @@
-<h1>Editing bike</h1>
+<div class="container">
+  <h1>Editing bike</h1>
   
-<%= render 'form' %>
+  <%= render 'form' %>
   
-<%= link_to 'Show', @bike %> |
-<%= link_to 'Back', bikes_path %>
+  <%= link_to 'Show', @bike %> |
+  <%= link_to 'Back', bikes_path %>
+</div>

app/views/bikes/index.html.erb

@@ -1,29 +1,30 @@
-<h1>Listing bikes</h1>
+<div class="container">
 
-<table class="table table-striped table-bordered table-hover">
-  <thead>
-    <tr>
-      <th> Brand </th>
-      <th> Model </th>
-      <th></th>
-      <th></th>
-      <th></th>
-    </tr>
-  </thead>
+  <h1>Listing bikes</h1>
 
-  <tbody>
-    <% @bikes.each do |bike| %>
+  <table class="table table-striped table-bordered table-hover">
+    <thead>
       <tr>
-        <td><%= bike.brand %></td>
-        <td><%= bike.model %></td>
-        <td><%= link_to 'Show', bike %></td>
-        <td><%= link_to 'Edit', edit_bike_path(bike) %></td>
-        <td><%= link_to 'Destroy', bike, method: :delete, data: { confirm: 'Are you sure?' } %></td>
+        <th> Brand </th>
+        <th> Model </th>
+        <th></th>
+        <th></th>
+        <th></th>
       </tr>
-    <% end %>
-  </tbody>
-</table>
+    </thead>
+    <tbody>
+      <% @bikes.each do |bike| %>
+        <tr>
+          <td><%= bike.brand %></td>
+          <td><%= bike.model %></td>
+          <td><%= link_to 'Show', bike %></td>
+          <td><%= link_to 'Edit', edit_bike_path(bike) %></td>
+          <td><%= link_to 'Destroy', bike, method: :delete, data: { confirm: 'Are you sure?' } %></td>
+        </tr>
+      <% end %>
+    </tbody>
+  </table>
   
-<br>
-
-<%= link_to ' + Log Bike', new_bike_path %>
+  <br>
+  <%= link_to ' + Log Bike', new_bike_path, class: "btn btn-default" %>
+</div>

app/views/bikes/show.html.erb

@@ -1,7 +1,9 @@
-<p id="notice"><%= notice %></p>
-<%= form_for(@bike) do |f| %>
-  <%= render 'fields', f: f, disabled: true %>
-<% end %>
+<div class="container">
+  <p id="notice"><%= notice %></p>
+  <%= form_for(@bike) do |f| %>
+    <%= render 'fields', f: f, disabled: true %>
+  <% end %>
   
-<%= link_to 'Edit', edit_bike_path(@bike) %> |
-<%= link_to 'Back', bikes_path %>
+  <%= link_to 'Edit', edit_bike_path(@bike) %> |
+  <%= link_to 'Back', bikes_path %>
+</div>