twitter-bootstrap-railsインストール

2013/09/09 03:59

twitter-bootstrap-railsのインストール備忘録です。

* 環境

ruby 2.0.0
rails 4.0.0

* Gemfile

追記

gem 'therubyracer', platforms: :ruby
gem 'twitter-bootstrap-rails', :git => 'git://github.com/seyhunak/twitter-bootstrap-rails.git'
gem 'less-rails-bootstrap'

* 実行

bundle install
rails g bootstrap:install
rails g bootstrap:layout application
rails g controller welcome index

* app/assets/stylesheets/application.css

追記

*= require bootstrap_and_overrides

* app/assets/javascripts/application.js

追記

//= require twitter/bootstrap

* bootstrap_and_overrides.css.less

ファイル追加

@import "twitter/bootstrap/bootstrap";
body {
  padding-top: 60px;
}
@import "twitter/bootstrap/responsive";

* app/helpers/bootstrap_flash_helper.rb

ファイル追加

module BootstrapFlashHelper
  ALERT_TYPES = [:error, :info, :success, :warning]

  def bootstrap_flash
    flash_messages = []
    flash.each do |type, message|
      # Skip empty messages, e.g. for devise messages set to nothing in a locale file.
      next if message.blank?
      
      type = :success if type == :notice
      type = :error   if type == :alert
      next unless ALERT_TYPES.include?(type)

      Array(message).each do |msg|
        text = content_tag(:div,
                           content_tag(:button, raw("×"), :class => "close", "data-dismiss" => "alert") +
                           msg.html_safe, :class => "alert fade in alert-#{type}")
        flash_messages << text if msg
      end
    end
    flash_messages.join("\n").html_safe
  end
end

* app/views/layouts/application.html.erb

修正

“data-turbolinks-track” => true を追加

<%= stylesheet_link_tag "application", :media => "all", "data-turbolinks-track" => true %>
<%= javascript_include_tag "application", "data-turbolinks-track" => true %>

参考

参考にさせていただきました。
ありがとうございました。