やっぱ角丸CSSとかrailsアプリに組み込みたいよなぁ、などと思っていたところ
Web App Themeを試していなかったのを思い出したので
やってみた。
pilu's web-app-theme at master - GitHub
Web App Theme
→デモ。右のサイドバーでテーマを変更して確認できる。
install
gemとpluginが用意されているが、とりあえずプロジェクト依存なのでpluginでインストール。
（gemの場合はenvironment.rbへversion追記）
sudo gem install web-app-theme -s http://gemcutter.org
script/plugin install git://github.com/pilu/web-app-theme.git
Theme Generator
まぁ、readmeに載ってますが。
layout
第1引数はlayout名。引数無しなら、application.html.erbとなる。
script/generate theme
（application.html.erbとして使用する場合は、各モデル用のlayoutファイルを削除）
theme
テーマ名を指定。
script/generate theme --theme="drastic-dark"
上のデモと同等のhtmlが
vendor/plugins/web-app-theme/index.html
にあるので、そこでテーマ名が確認できます。（現在12種）
上記コマンドを再度入力することで途中で変更も可能。
public/stylesheets/themes 以下にcssがそれぞれ格納されます。
アプリケーション名
script/generate theme --app_name="My New Application"
Themed Generator
テーマ用のviewに（デモページのように）書き換えてくれます。
model名の複数形をcontroller名にしている場合（scaffoldなど通常のrailsの場合）は
第１引数にcontroller名を設定する。
script/generate themed posts # you have a model named Post and a controller named PostsController
modelとcontrollerが違う場合は
第１引数にcontroller名、第２引数にmodel名を設定する。
script/generate themed items post
will_paginate
なんとwill_paginate用のオプションも用意されています。
script/generate themed items post --with_will_paginate
エラーメッセージをform内にしたい場合
environment.rb
ActionView::Base.field_error_proc = Proc.new do |html_tag, instance|
if html_tag =~ /<label/
%|<div class="fieldWithErrors">#{html_tag} <span class="error">#{[instance.error_message].join(', ')}</span></div>|
else
html_tag
end
end|
など、一部端折りましたが
初期から導入するのがいいんじゃないでしょうか。
こんな感じで。
rails 〜 script/generat scaffold hoge 〜 rake db:migrate script/plugin install git://github.com/pilu/web-app-theme.git script/generate theme --app_name="My New Application" script/generate themed hoges #以下、pagingが必要であれば script/generate themed hoges --with_will_paginate #ってやって、 #後は通常のpaginateの実装にしてやればok。 #environment.rb require 'will_paginate' #controller @hoges = Hoge.paginate(:per_page => 10, :page => params[:page])
