Wrap flash messages in a div instead of a paragraph

This allows more complex HTML in the message, closing #896.

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index 42616fadbab6e9350f48dc76b454b2acd3ce24b9..e08b9ab87913987dea8987a6f78928501c260148 100644 (file)
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -1746,19 +1746,26 @@ header .search_form {
 
 /* Rules for "flash" notice boxes shown at the top of the content area */
 
 
 /* Rules for "flash" notice boxes shown at the top of the content area */
 

-.error {
+.flash {

   padding: $lineheight;
   padding: $lineheight;

-  background-color: #ff7070;
-}

 
 

-.warning {
-  padding: $lineheight;
-  background-color: #ffe0cc;
-}
+  &.error {
+    background-color: #ff7070;
+  }

 
 

-.notice {
-  padding: $lineheight;
-  background-color: #CBEEA7;
+  &.warning {
+    background-color: #ffe0cc;
+  }
+
+  &.notice {
+    background-color: #CBEEA7;
+  }
+
+  div.message {
+    display: inline-block;
+    margin-left: $lineheight / 2;
+    vertical-align: middle;
+  }

 }
 
 /* Rules for highlighting fields with rails validation errors */
 }
 
 /* Rules for highlighting fields with rails validation errors */

diff --git a/app/views/layouts/_flash.html.erb b/app/views/layouts/_flash.html.erb
index 51ef3fe41548d202bec942e39748e39b79a4e940..5a4288c4d2c0ed250fe8e23c06cc9d6fb83b246b 100644 (file)
--- a/app/views/layouts/_flash.html.erb
+++ b/app/views/layouts/_flash.html.erb
@@ -1,20 +1,20 @@
 <% if flash[:error] %>
 <% if flash[:error] %>

-  <p class="error">
+  <div class="flash error">

     <%= image_tag("notice.png", :class => "small_icon", :border => 0) %>
     <%= image_tag("notice.png", :class => "small_icon", :border => 0) %>

-    <%= raw flash[:error] %>
-  </p>
+    <div class="message"><%= raw flash[:error] %></div>
+  </div>

 <% end %>
 
 <% if flash[:warning] %>
 <% end %>
 
 <% if flash[:warning] %>

-  <p class="warning">
+  <div class="flash warning">

     <%= image_tag("notice.png", :class => "small_icon", :border => 0) %>
     <%= image_tag("notice.png", :class => "small_icon", :border => 0) %>

-    <%= raw flash[:warning] %>
-  </p>
+    <div class="message"><%= raw flash[:warning] %></div>
+  </div>

 <% end %>
 
 <% if flash[:notice] %>
 <% end %>
 
 <% if flash[:notice] %>

-  <p class="notice">
+  <div class="flash notice">

     <%= image_tag("notice.png", :class => "small_icon", :border => 0) %>
     <%= image_tag("notice.png", :class => "small_icon", :border => 0) %>

-    <%= raw flash[:notice] %>
-  </p>
+    <div class="message"><%= raw flash[:notice] %></div>
+  </div>

 <% end %>
 <% end %>

diff --git a/test/controllers/message_controller_test.rb b/test/controllers/message_controller_test.rb
index 1476831cf4dd29923262fe16daf1a42895ee4087..ad604174d952808e42f4e3ea94b8d9ec4ed487cc 100644 (file)
--- a/test/controllers/message_controller_test.rb
+++ b/test/controllers/message_controller_test.rb
@@ -149,7 +149,7 @@ class MessageControllerTest < ActionController::TestCase
             :message => { :title => "Test Message", :body => "Test message body" }
           assert_response :success
           assert_template "new"
             :message => { :title => "Test Message", :body => "Test message body" }
           assert_response :success
           assert_template "new"

-          assert_select "p.error", /wait a while/
+          assert_select ".error", /wait a while/

         end
       end
     end
         end
       end
     end