RailsでTwitterBootstrap Railsで使えるGem

SASS/SCSSでButtonをカスタマイズするならSassy Buttonsが簡単

投稿日:

By: Meike SchönhütteCC BY 2.0[/caption]

 

jaredhardy.com/sassy-buttons/

Railsでのインストール方法

Gemfile

bundle

scss

 使い方

 

BootstrapのデフォルトのButton

テーマにあってない

screenshot

Sassy Buttons

ズルいデザインを参考にしながら

 

screenshot

めり込んだボタンだって簡単

screenshot

インセット使い方間違ってたかも

もともとのボタンと同じにしてから縁取りの色を濃い目に指定するといいかも

 

screenshot

*Bootstrapのテーマカスタマイズ

RailsエンジニアのためのTwitter Bootstrapカスタマイズ例

github.com/machida/CustomizedTwitterBootstrap

base設定用のsassを作って

_config.css.sassで3色だけ決めて、テキストの色を上か下の方法で気に入った方をつかうだけ(違いはスライドをみる)

 

Bootstrap3用

4色ほど指定するだけでTwitter Bootstrapの配色を良い感じにしてくれるSass

-RailsでTwitterBootstrap, Railsで使えるGem
-

執筆者:

関連記事

RailsでOAuthを使うには~OmniAuth

By: Freenerd – CC BY 2.0   github.com/intridea/omniauth   目次1 OmniAuthの受け持つ役割2 Rails …

Rails3.2でFacebook風インターフェイスでタグづけ〜acts-as-taggable-on+jquery.tokenInput

By: Mauquoy Token Company – CC BY 2.0 railscasts.com/episodes/258-token-fields?language=ja&#03

RailsでHTML5対応のvideoプレイヤーを利用してみる~flowplayer5.0.0

  参考 flowplayer.org/ Flowplayerのサイトからバージョン5.0.0がダウンロードできる flowplayer-gemのバージョンは3.2.4 バージョン5では基本 …

Rails3.2でJasmineをつかってCoffeeScriptをテスト~jasminerice

    #261 Testing JavaScript with Jasmine (revised)   addyosmani.github.com/backbone-f

RailsでECサイト構築4 確認メールを送る~spree

  spreeでは注文したときと発送したときにメールを送信できるように設定できるので、やってみた   目次1 設定2 翻訳 設定 管理画面から設定>メールシステムの設定から これで …