カテゴリー:
Rails
タグ:
 Rails css Bootstrap sass bootstrap-sass

このエントリーをはてなブックマークに追加
更新日時:
2014年04月27日(日)
作成日時:
2014年04月27日(日)

前の記事 / 次の記事

lessじゃなくてsassなbootstrapをインストールしたい。
twbs/bootstrap-sass を見ながら。

Gemfileを書く。

gem 'sass-rails',     '~> 4.0.0'
gem 'bootstrap-sass', '3.1.1'

bootstrap-sassのバージョンを3.1.1に固定しているのは不用意なデザインの崩れを防ぐため。
バグフィックス的なアップデートは構わないけどCSSの内容が変わるアップデートが適用されるのは困る。

Railsの中で呼び出す

CSS

$ vi application.css
*= require bootstrap

JavaScript

$ vi application.js
//= require bootstrap

sassの変数をカスタマイズする場合

$ vi bootstrap_custom.css.sass

// bootstrapに適用する変数を設定
$grid-float-breakpoint: 992px

@import "bootstrap"

// bootstrapで設定された変数を利用
.font-size-large
  font-size: $font-size-large
// bootstrapで定義されているmixinを利用
.opacity-half
  @include opacity(0.5)

bootstrap_custom.css.sassと新しいファイルをつくってるのは、
application.cssに書いちゃいけないって訳ではないけどなんかキモいので。