Hatena::ブログ(Diary)

@camelmasaの開発日記 このページをアンテナに追加 RSSフィード

Githubで活動しています。

2012-12-11

Subtle Patternsで提供されている画像を簡単に扱えるgem subtlepatternsを作成しました。

| 03:03

id:ken_c_loさんが作成された”ズルいデザインテクニック”の中で紹介されていたSubtle Patternsが仕事でもプライベートでも使用していて、便利だなーと思ってたので、もっと簡単に利用出来る様gemにしました。

参考 http://d.hatena.ne.jp/ken_c_lo/20121115/1353004699


github

https://github.com/camelmasa/subtlepatterns


使い方

githubのREADMEに書いてありますがこちらにも記します。


Railsへのインストール方法

Gemfileに追加

gem "subtlepatterns"

コマンドを実行

bundle install

application.cssに追加

*= require subtlepatterns/prefix

CSSのクラス名にprefix(subtlepattern)が要らない場合

*= require subtlepatterns

これでインストール完了です。

使用方法

後はHTML内で指定していきます。

<body class="subtlepattern_xv">

<div class="subtlepattern_zigzag">

と指定します。

すると、background-imageにSubtle Patternsの画像が表示されます。


CSSのクラス名一覧はgithubのREADMEを参照してください。

https://github.com/camelmasa/subtlepatterns

トラックバック - http://d.hatena.ne.jp/camelmasa/20121211/1355249005