Nithin Bekal

Posts About Notes Slides

Bootstrap flash messages in Rails

14 May 2015

After avoiding Bootstrap for so long, I’m starting to see some of the advantages that it offers. For instance, I needed to style flash messages today, and turn out, I don’t have to write any CSS for it. This is all the code I needed:

/ app/views/layouts/application.haml
= render 'shared/flash'
  
/ app/views/shared/_flash.haml
- flash.each do |type, message|
  %div{ class: "alert #{bootstrap_flash_class(type)} fade in" }
    = message
    %button.close{ data: { dismiss: 'alert' } } x

Then we add a simple helper method to translate the flash classes to the bootstrap flash class names:

module ApplicationHelper
  def bootstrap_flash_class(flash_type)
    { success: 'alert-success',
      error:   'alert-danger',
      alert:   'alert-warning',
      notice:  'alert-info'
    }[flash_type.to_sym] || flash_type.to_s
  end
end

Maybe it’s not such bad idea to start new projects with Bootstrap after all.

Hi, I’m Nithin Bekal. I work at Shopify in Ottawa, Canada. Previously, co-founder of CrowdStudio.in and WowMakers. Ruby is my preferred programming language, and the topic of most of my articles here, but I'm also a big fan of Elixir. Tweet to me at @nithinbekal.