[B! Compass] waviaeiのブックマーク

WebデザイナーのためのSass/Compass入門

waviaei 2013/09/28

Sass
Compass

リンク

君は知っているか、あのCompassのstatsコマンドを！ - Qiita

CSSをリファクタリングしようと思うと、どっから手をつけたら良いかわからなくないですかね？僕はわかりません。特にSassのような@importでいろいろファイル分割していると、あれこれなんのファイルだったお（＾ω＾;）ってことがよくありませんかね？僕はないです！ということで、あなたがCompassプロジェクトを使用しているのならば、config.rbのある場所で下記のコマンドを打ってみましょう。そうすると下記のようなCSSに関する情報が表示されます。どこで何回ミックスインが定義されて使用されているか、ファイルサイズがどれくらいかプロパティがどれだけ宣言されているかなど、一目瞭然ですね。これで、どこからリファクタリング・手をつけていったらいいのかなど参考にできるかと思います。ちなみに、statsコマンドのヘルプは下記 $ compass stats --help Usage: co

waviaei 2013/09/20

Compass
CSS

リンク

howtohp.com - howtohp リソースおよび情報

Get a new domain registered at NameSilo.com. Find out who owns any domain name with the WHOIS tool. This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.

waviaei 2013/08/07

Sass
Compass

リンク

Codekit使ってて最新バージョンのSassとかにしたいとき

キム兄さんに教えてもらったんですが忘れるのでメモ。ターミナルでsudo gem install sass sassがインストールできたら同様にcompassもインストールするためにsudo gem update --system 2に続いてsudo gem install compass 続いてCodekitで外部コンパイラの設定をするために、CodekitのPreferencesのLanguagesタブを開いて Sass/Scss → Language Options → Advanced Compiler Settings で Use the Sass exexutable at this path: を有効に開いたファイルダイアログでsassを指定（binディレクトリが開かれるのでその中に入ってるsassです）同様にCompass → Language Options → Ad

waviaei 2012/08/16

リンク

CompassでCSSスプライト（Retina対応）

今はコレです。 $sprite2x: sprite-map("sprite2x/*.png"); $sprite-img:sprite-url($sprite2x); @mixin sprite-background2x($name) { background-image: sprite-url($sprite2x); background-repeat: no-repeat; overflow: hidden; width: image-width(sprite-file($sprite2x, $name)) / 2; height: image-height(sprite-file($sprite2x, $name)) / 2; $ypos: round(nth(sprite-position($sprite2x, $name), 2) / 2); background-positio

waviaei 2012/07/19

リンク

MacのCodeKitでCompassを使う

MacのCodeKitでCompassを使う Compassに関するエントリーを書いていたら、「scoutとcodekitでそのうちできるようにならんかな」というツイートをいただきまました。 CodeKitにはCompassが含まれてますのでCodeKitでは可能です。(CodeKitに関してはフロントエンドの開発を加速するCodeKit :: 5509を参照してください) CodeKitのサイドにあるプロジェクトの一覧から、Compassを利用したいプロジェクトを右クリックして、「Compass」→「Use Compass on this project」を選択。初回は確認画面が表示されますので「New Config File」を選択。 Compassの設定画面が表示されるので画象フォルダやCSSフォルダなどの設定をし「Create Config File」を選択するとCompassが

waviaei 2012/06/19

リンク

TheSassWay.com – All SaSS Related Stuff

Among the myriad of resources available to entrepreneurs and industry professionals, podcasts have emerged as a potent medium for knowledge dissemination and community building. Within this podcasting landscape, one niche stands out prominently: Software as a Service (SaaS) podcasts. These audio platforms have garnered significant attention and acclaim, serving as invaluable sources of insights, s