changed flash error display logic, added a helper for handling flash css selectors

Author: morenoh149

app/assets/stylesheets/application.css

@@ -13,3 +13,4 @@
  */
 
 body { padding-top: 70px; }
+.alert { margin-top: 10px; }

app/helpers/application_helper.rb

@@ -1,2 +1,13 @@
 module ApplicationHelper
+
+  def flash_class(type)
+    case type
+    when :alert
+      "alert-danger"
+    when :notice
+      "alert-info"
+    else
+      ""
+    end
+  end
 end

app/views/devise/registrations/new.html.erb

@@ -1,26 +1,20 @@
-<h2>Sign up</h2>
+<div class="row">
+  <div class="col-sm-5 col-sm-offset-3">
+    <%= simple_form_for(resource, :as => resource_name, :url => registration_path(resource_name), html: {class: "well"}) do |f| %>
 
-<%= form_for(resource, :as => resource_name, :url => registration_path(resource_name)) do |f| %>
   <%= devise_error_messages! %>
-  <div><%= f.label :first_name %><br />
-    <%= f.text_field :first_name %></div>
 
-  <div><%= f.label :last_name %><br />
-    <%= f.text_field :last_name %></div>
-
-  <div><%= f.label :profile_name %><br />
-    <%= f.text_field :profile_name %></div>
-
-  <div><%= f.label :email %><br />
-  <%= f.email_field :email, :autofocus => true, class: "form-control" %></div>
-
-  <div><%= f.label :password %><br />
-  <%= f.password_field :password %></div>
-
-  <div><%= f.label :password_confirmation %><br />
-  <%= f.password_field :password_confirmation %></div>
-
-  <div><%= f.submit "Sign up" %></div>
+  <fieldset>
+    <legend>Sign up</legend>
+    <%= f.input :first_name %>
+    <%= f.input :last_name %>
+    <%= f.input :profile_name %>
+    <%= f.input :email %>
+    <%= f.input :password %>
+    <%= f.input :password_confirmation %>
+
+    <div><%= f.button :submit, "Sign up" %></div>
+  </fieldset>
 <% end %>
 
 <%= render "devise/shared/links" %>

app/views/layouts/application.html.erb

@@ -38,8 +38,14 @@
   </nav>
 
   <div class="container">
-    <p class="notice"><%= notice %></p>
-    <p class="alert"><%= alert %></p>
+    <% flash.each do |type, message| %>
+      <div class="alert alert-dismissable <%= flash_class type %>">
+        <button type="button" class="close" data-dismiss="alert"
+                aria-hidden="true">&times;
+        </button>
+        <%= message %>
+      </div>
+    <% end %>
 
     <%= yield %>
   </div>