blueprint-cssを試す

月ごとのeventを取得して表示できたので、こんどは見た目を整える。

tableでごりごり書くのが一番手っ取り早いけど、すぐにcssファイルがぐちゃぐちゃになるんだなあ素人は。cssの書き方わかってないし。

そんなんでできるだけ手軽に、かつ整然と記述できるcssってどうやるのよ、と調べて・・・とりあえずblueprint-cssを試してみる。(^^;)求めていたものとは違うけど、レイアウトを簡単に作れるという点では優れものでしょうか。

まずはzip落としてきてpublicフォルダに「blueprint」フォルダをコピーする。で、application.html.erbで

<%= stylesheet_link_tag "blueprint/screen"  %>
<%= stylesheet_link_tag "blueprint/plugins/fancy-type/screen"  %>

とインクルード。
そうすると、なにもしていないのにtableが

こうなりました。trタグは１行おきに色分け、tdタグは同じ幅に揃っています。

引き続き、レイアウトに

Header
Head-Menu

とかなんとか記入して、gridが表示されるようにすると


こうなった、と。

その後、月ごとの行事予定をtable使ってつくろうとしたら、どーもうまくいかない。やはり「span-3」とかでコラムを作っていかないとだめみたい。

うーん、やっぱりふつうにtable使ったほうがいいかなあ。でも全体的なページのレイアウトはものすごく簡単に作れるしなあ。

週表示とか、年間表示とかでうまく使えたらいいんだけど。

というあたりで本日の勉強は終了。

cssそのものを合理的に書くのは、「haml/sass」がいいんでしょうかねえ。