お世話になったことのある正規表現

●ある文字列を含まない行を削除
^(?!.*文字列).*$
たとえばURLの***.com/product/以降が欲しいなーって時に。

●改行のみの行の削除
^\n
良く使いますね。

後は使っていくうちに追加していこう。
前にお世話になったのは覚えていないや。

●コメント削除
/\*/?(\n|[^/]|[^*]/)*\*/
Sassで作成したCSSでlineコメント入りで出しちゃったよーって時にSassで直せないときは以下。
/\* line/?(\n|[^/]|[^*]/)*\*/

sass + koala で急にコンパイルされなくなったとき

作業していて、数分前までは普通に動いていたのに急にコンパイルされなくなったとき。

windowsだとkoalaは問題なくコンパイル完了の「Success」を出す。
が、CSS自体は更新されていない。

悩む悩む。

他のサイトで設定したものはちゃんと吐き出しているので、koala自体が調子悪い訳じゃない。

で、macで問題のサイト定義したscssをコンパイルしてみると
「/bin/sh: compass: command not found」
と出た。

ググってもsublimeの設定ばかりであまり核心をついたものは見つからず。

で、結局config.rbを削除してもう一回設定しなおしたら直りました。

謎です。

と思っていたら結局直らず。。

最初からサイトデータを一個ずつコピーしていきどこで問題が発生するのかチェック。

判明したこと(エビデンスは無いので勘です)

sassのコンパイル用のファイル名●●●.scssと同名のimportファイルを作成するとバグが発生する模様。

つまり
●●●.scss
に_●●●.scssというファイルをimportしてしまうとエラーになる。

何が怖いってwindowsだとエラーとして認識されずにcssファイルが更新されないだけっていう。macだと上記のcompass:command ////
になるからマシだけど。

で、注意するのが上記エラーが出たのでファイル名を変更したとしてももうダメ。config.rbと●●●.scssファイルを削除して新しく作り、koalaのサイト定義も消してやり直さないとダメっぽい。

レスポンシブデザインをしていて画像の横幅を100%にしたのは良いけど、PCサイトだと原寸にしたいんだよねって時

もしかしたら、誰でも知っていることなのかもしれないが自分は知らなかった。。

inheritにしてもダメだし、pxで指定するしかないのかしら・・・でも幅なんて色々あるわって悩んでいたらスゴイ答えは簡単

img{
max-width:100%
}

これでいいらしい。

maxがつくことで自分自身の100%までってことになるのかな。

レスポンシブサイトでメニューをまとめる時にナビとかが複数あってどうしような時

あります。

GlovalNaviだけまとめるメニューのプラグインは良く見かけるが、サイト内ではグロナビに加えてSNSのナビだったり、ログインのナビが独立して複数存在することは多々ある。

で、ようやく昔見つけていたサイトを再発見。

Drower Slider MenuってJs
http://jquer.in/javascript-and-jquery-solutions-for-fantastic-mobile-websites/drawer-slide-menu/

使い方は以下を参考にさせていただきました。

http://www.redman-m.com/wp-dr/
http://wryoku.com/drawer_slide_menu/

 

2015/03/18追記
とても参考になるまとめページが。
http://webdesignmagazine.net/javascript/drawer/