Introduced bootstrap. Fixed a bunch of styling issues and a few contr…

…oller problems.
adammacleod · Oct 4, 2012 · 25e1142 · 25e1142
1 parent a24ea68
commit 25e1142
Show file tree

Hide file tree

Showing 27 changed files with 134 additions and 121 deletions.
diff --git a/Gemfile b/Gemfile
@@ -18,6 +18,7 @@ group :assets do
   gem 'therubyracer', :platforms => :ruby
 
   gem 'uglifier', '>= 1.0.3'
+  gem 'less-rails-bootstrap'
 end
 
 gem 'jquery-rails'

diff --git a/Gemfile.lock b/Gemfile.lock
@@ -38,6 +38,7 @@ GEM
       coffee-script-source
       execjs
     coffee-script-source (1.3.3)
+    commonjs (0.2.6)
     erubis (2.7.0)
     execjs (1.4.0)
       multi_json (~> 1.0)
@@ -48,6 +49,13 @@ GEM
       railties (>= 3.1.0, < 5.0)
       thor (~> 0.14)
     json (1.7.5)
+    less (2.2.2)
+      commonjs (~> 0.2.6)
+    less-rails (2.2.3)
+      actionpack (>= 3.1)
+      less (~> 2.2.0)
+    less-rails-bootstrap (2.1.1)
+      less-rails (~> 2.2.0)
     libv8 (3.3.10.4)
     mail (2.4.4)
       i18n (>= 0.4.0)
@@ -110,6 +118,7 @@ DEPENDENCIES
   bcrypt-ruby (~> 3.0.0)
   coffee-rails (~> 3.2.1)
   jquery-rails
+  less-rails-bootstrap
   rails (= 3.2.8)
   sass-rails (~> 3.2.3)
   sqlite3

diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
@@ -10,4 +10,11 @@
  *
  *= require_self
  *= require_tree .
+ *= require twitter/bootstrap
  */
+.links {
+  margin-bottom: 1.2em;
+}
+.link_header {
+  margin-bottom: 0px;
+}
diff --git a/app/assets/stylesheets/scaffolds.css.scss b/app/assets/stylesheets/scaffolds.css.scss
@@ -4,6 +4,7 @@ body {
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 13px;
   line-height: 18px;
+  padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
 }
 
 p, ol, ul, td {

diff --git a/app/controllers/links_controller.rb b/app/controllers/links_controller.rb
@@ -18,7 +18,7 @@ def show
     @link = Link.find_by_slug(params[:id])
 
     respond_to do |format|
-      format.html # show.html.erb
+      format.html { redirect_to @link.link }
       format.json { render json: @link }
     end
   end
@@ -38,7 +38,7 @@ def new
   def edit
     @link = Link.find_by_slug(params[:id])
     unless @link.user == @current_user
-      redirect_to @link
+      redirect_to link_comments_url(@link)
     end
   end
 
@@ -50,8 +50,8 @@ def create
 
     respond_to do |format|
       if @link.save
-        format.html { redirect_to @link, notice: 'Link was successfully created.' }
-        format.json { render json: @link, status: :created, location: @link }
+        format.html { redirect_to link_comments_url(@link), notice: 'Link was successfully created.' }
+        format.json { render json: link_comments_url(@link), status: :created, location: link_comments_url(@link) }
       else
         format.html { render action: "new" }
         format.json { render json: @link.errors, status: :unprocessable_entity }
@@ -70,7 +70,7 @@ def update
         format.html { render action: "show" }
         format.json { head :no_content }
       elsif @link.update_attributes(params[:link])
-        format.html { redirect_to @link, notice: 'Link was successfully updated.' }
+        format.html { redirect_to link_comments_url(@link), notice: 'Link was successfully updated.' }
         format.json { head :no_content }
       else
         format.html { render action: "edit" }
@@ -86,7 +86,7 @@ def destroy
     @link.destroy
 
     respond_to do |format|
-      format.html { redirect_to links_url }
+      format.html { redirect_to root_url, notice: 'BLAM! Link was thoroughly destroyed!' }
       format.json { head :no_content }
     end
   end

diff --git a/app/controllers/users_controller.rb b/app/controllers/users_controller.rb
@@ -1,5 +1,5 @@
 class UsersController < ApplicationController
-  skip_before_filter :require_login, :only => [:new, :create]
+  skip_before_filter :require_login, :only => [:new, :show, :create]
 
   # GET /users
   # GET /users.json

diff --git a/app/views/comments/_comment.html.erb b/app/views/comments/_comment.html.erb
@@ -1,5 +1,8 @@
-  <tr>
-    <td><%= comment.body %></td>
-    <td><%= link_to comment.user.username, comment.user %></td>
-    <td><%= link_to comment.link.title, link_comments_path(comment.link) %>
-  </tr>
+  <div>
+    <strong><%= link_to comment.user.username, comment.user %></strong>
+    <p>
+      <%= comment.body %><br>
+      <%= link_to 'parent', link_comments_path(comment.link) %>
+    </p>
+
+  </div>
diff --git a/app/views/comments/_comments.html.erb b/app/views/comments/_comments.html.erb
@@ -1,10 +1 @@
-<table>
-  <tr>
-    <th>Comment</th>
-    <th>User</th>
-    <th>Parent</th>
-  </tr>
-
 <%= render comments %>
-
-</table>
diff --git a/app/views/comments/_form.html.erb b/app/views/comments/_form.html.erb
@@ -1,6 +1,5 @@
 <%= form_for([@link, @link.comments.build]) do |f| %>
   <div class="field">
-    <%= f.label :body %><br />
     <%= f.text_area :body %>
   </div>
   <div class="actions">

diff --git a/app/views/comments/index.html.erb b/app/views/comments/index.html.erb
@@ -1,7 +1,12 @@
 <%= render :partial => 'links/links', :locals => { :links => [@link] } %>
 
-<h2>Comments</h2>
+<p><%= @link.body %></p>
+
+<h3>Comments</h3>
 
 <%= render :partial => 'comments', :locals => { :comments => @link.comments } %>
 
-<%= render 'form' %>
+<% if @current_user %>
+  <hr>
+  <%= render 'form' %>
+<% end %>
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
@@ -7,31 +7,63 @@
   <%= csrf_meta_tags %>
 </head>
 <body>
+  <div class="navbar navbar-inverse navbar-fixed-top">
+    <div class="navbar-inner">
+      <div class="container">
+        <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+          <span class="icon-bar"></span>
+          <span class="icon-bar"></span>
+          <span class="icon-bar"></span>
+        </a>
+        <%= link_to 'Circled', root_path, html_options = { class: "brand" } %>
+        <div class="nav-collapse collapse">
+          <ul class="nav pull-right">
+            <!-- <li class="active"><a href="#">Home</a></li> -->
+            <% if @current_user %>
+              <li><%= link_to @current_user.username, users_path %></li>
+              <li><%= link_to 'Submit Link', new_link_path %></li>
+              <li>
+                <%= form_tag(logins_path, { :method => "delete", :class => "navbar-form"}) do %>
+                  <%= submit_tag("Log Out") %>
+                <% end %>
+              </li>
+            <% else %>
+              <li><%= link_to 'Log In', logins_path %></li>
+              <li><%= link_to 'Register',new_user_path %></li>
+            <% end %>
+          </ul>
+        </div><!--/.nav-collapse -->
+      </div>
+    </div>
+  </div>
 
-<h1><%= link_to 'Circled', root_path %></h1>
-<hr>
+  <div class="container">
+    <div class="row">
+      <div class="span12">
+        <% if flash[:notice] %>
+          <p id="notice"><%= flash[:notice] %></p>
+        <% end %>
+        <% if flash[:error] %>
+          <p id="error"><%= flash[:error] %></p>
+        <% end %>
+      </div>
+    </div>
 
-<% if @current_user %>
-  <p>Welcome, <%= link_to @current_user.username, users_path %></p>
-  <%= form_tag(logins_path, :method => "delete") do %>
-    <div class="actions">
-      <%= submit_tag("Log Out") %>
+    <!-- Example row of columns -->
+    <div class="row">
+      <div class="span12">
+        <%= yield %>
+      </div>
     </div>
-  <% end %>
 
-<% else %>
-  <p><%= link_to 'Log In', logins_path %> | <%= link_to 'Register', new_user_path %></p>
-<% end %>
-<hr>
+    <hr>
+
+    <footer>
+      <p>&copy; Nobody 2012</p>
+    </footer>
 
-<% if flash[:notice] %>
-  <p id="notice"><%= flash[:notice] %></p>
-<% end %>
-<% if flash[:error] %>
-  <p id="error"><%= flash[:error] %></p>
-<% end %>
+  </div> <!-- /container -->
 
-<%= yield %>
 
 </body>
 </html>
diff --git a/app/views/links/_form.html.erb b/app/views/links/_form.html.erb
@@ -12,19 +12,19 @@
   <% end %>
 
   <div class="field">
-    <%= f.label :title %><br />
+    <%= f.label :title %>
     <%= f.text_field :title %>
   </div>
   <div class="field">
-    <%= f.label :link %><br />
+    <%= f.label :link %>
     <%= f.text_field :link %>
   </div>
   <div class="field">
-    <%= f.label :body %><br />
+    <%= f.label :body %>
     <%= f.text_area :body %>
   </div>
   <div class="field">
-    <%= f.label :slug %><br />
+    <%= f.label :slug %>
     <%= @link.slug %>
   </div>
   <div class="actions">

diff --git a/app/views/links/_link.html.erb b/app/views/links/_link.html.erb
@@ -1,9 +1,11 @@
-  <tr class="<%= link_counter % 2 == 0 ? "even" : "odd" %>">
-    <td><%= link.title %></td>
-    <td><%= link.body %></td>
-    <td><%= link.link %></td>
-    <td><%= link.user.username %></td>
-    <td><%= link_to 'Comments', link_comments_path(link) %></td>
-    <td><%= link_to 'Edit', edit_link_path(link) %></td>
-    <td><%= link_to 'Destroy', link, method: :delete, data: { confirm: 'Are you sure?' } %></td>
-  </tr>
+<div class="links">
+  <h2 class="link_header"><%= link_to link.title, link.link %></h2>
+  <div>
+    <%= link_to 'Comments', link_comments_path(link) %>
+    <% if link.user == @current_user %>
+      | <%= link_to 'Edit', edit_link_path(link) %>
+      | <%= link_to 'Destroy', link, method: :delete, data: { confirm: 'Are you sure?' } %>
+    <% end %>
+    | <%= link_to link.user.username, link.user %>
+  </div>
+</div>
diff --git a/app/views/links/_links.html.erb b/app/views/links/_links.html.erb
@@ -1,14 +1 @@
-<table>
-  <tr>
-    <th>Title</th>
-    <th>Body</th>
-    <th>Link</th>
-    <th>User</th>
-    <th></th>
-    <th></th>
-    <th></th>
-  </tr>
-
 <%= render links %>
-
-</table>
diff --git a/app/views/links/edit.html.erb b/app/views/links/edit.html.erb
@@ -1,6 +1,5 @@
-<h1>Editing link</h1>
+<h2>Editing link</h2>
 
 <%= render 'form' %>
 
-<%= link_to 'Show', @link %> |
-<%= link_to 'Back', links_path %>
+<%= link_to 'Cancel', link_comments_path(@link) %>
diff --git a/app/views/links/index.html.erb b/app/views/links/index.html.erb
@@ -1,5 +1,3 @@
-<h1>Listing links</h1>
-
 <%= render :partial => 'links', :locals => { :links => @links } %>
 
 <br />

diff --git a/app/views/links/new.html.erb b/app/views/links/new.html.erb
@@ -1,4 +1,4 @@
-<h1>New link</h1>
+<h2>New Link</h2>
 
 <%= render 'form' %>
 

diff --git a/app/views/links/show.html.erb b/app/views/links/show.html.erb
diff --git a/app/views/logins/new.html.erb b/app/views/logins/new.html.erb
@@ -1,12 +1,12 @@
-<h1>Login</h1>
+<h2>Login</h2>
 
 <%= form_tag(logins_path) do %>
   <div class="field">
-    <%= label_tag(:username, "Username:") %>
+    <%= label_tag(:username, "Username") %>
     <%= text_field_tag(:username) %>
   </div>
   <div class="field">
-    <%= label_tag(:password, "Password:") %>
+    <%= label_tag(:password, "Password") %>
     <%= password_field_tag(:password) %>
   </div>
   <div class="actions">

diff --git a/app/views/logins/show.html.erb b/app/views/logins/show.html.erb
@@ -1,5 +1,5 @@
 <script>window.location = '<%= root_url %>'; </script>
-<h1>Welcome, <%= @current_user.username %>!</h1>
+<h2>Welcome, <%= @current_user.username %>!</h2>
 
 <p>We are attempting to redirect you to the home page. Please keep your hands inside the cart at all times.</p>
 

diff --git a/app/views/users/_form.html.erb b/app/views/users/_form.html.erb
@@ -12,15 +12,15 @@
   <% end %>
 
   <div class="field">
-    <%= f.label :username %><br />
+    <%= f.label :username %>
     <%= f.text_field :username %>
   </div>
   <div class="field">
-    <%= f.label :password %><br />
+    <%= f.label :password %>
     <%= f.password_field :password %>
   </div>
   <div class="field">
-    <%= f.label :password_confirmation %><br />
+    <%= f.label :password_confirmation %>
     <%= f.password_field :password_confirmation %>
   </div>
   <div class="actions">