Rails4/Bootstrap の履歴(No.2)

• 履歴一覧
• 差分 を表示
• 現在との差分 を表示
• ソース を表示
• Rails4/Bootstrap へ行く。
  • 1 (2014-05-01 (木) 11:34:29)
  • 2 (2014-05-01 (木) 12:00:24)
  • 3 (2014-06-12 (木) 17:55:37)
  • 4 (2014-06-13 (金) 13:56:34)
  • 5 (2014-06-13 (金) 17:33:09)

&tag(Rails4/Bootstrap);

目次†[edit]

関連ページ†[edit]

TwitterBootstrapWithRails

参考情報†[edit]

• Ruby on Rails 4.0正式リリースとBootstrapの正しい設定法 | ユービックログ研究所
• Rails 4でRSpecとTwitter Bootstrap - tobioka.net - You Ain't Gonna Need It

twitter-bootstrap-railsを使って導入†[edit]

Gemfileの編集†[edit]

• sass-railsをコメントアウト

  #gem 'sass-rails', '~> 4.0.2'

• 以下を追加

  gem 'less-rails'
  gem 'therubyracer'
  gem 'twitter-bootstrap-rails'
  #gem 'execjs'
  

• bundle install実行

  bundle install --path vendor/bundle

Bootstrapを使ったテンプレートの生成†[edit]

• rails gで生成する。

  $ bundle exec rails g bootstrap:install
  $ bundle exec rails g bootstrap:layout application
  

• この段階で一応Bootstrapスタイルが適用される。

調整†[edit]

ナビゲーションバーがかぶるのを修正†[edit]

• app/assets/stylesheets/bootstrap_and_overrides.css.lessを編集

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