Big Sky :: zencoding-vim の Emmet サポートを始めます。

しばらく zencoding-vim の emmet ブランチで開発し、落ち着いたら master にマージします。

親参照

^ で親へ移動出来る様になってます。


.header>.nav^.logo

これが


<div class="header">

    <div class="nav"></div>

</div>

<div class="logo"></div>

こう展開されます。^^ で複数階層登れます。

高度なCSS補完

おそらくこれが emmet の最大の武器と思う。
まず m0.1 は


margin: 0.1em;

に展開される。また m2 は


margin: 2px;

に、m3p は


margin: 3%;

に展開される。本来ならば z-index の様に px 単位で無い物には単位を付けない様にしないといけないけど、この辺は後々やってく。

ベンダープレフィックス

好き嫌いありそうな機能ですが...
通常 bdrs8 が


border-radius: 8px;

にされるが、頭に - を付けると


-bdrs8


-webkit-border-radius: 8px;

-moz-border-radius: 8px;

border-radius: 8px;

と変換される。また、lg(top,#fff,#000) から


background-image:  -webkit-gradient(top, 0 0, 0 100, from(#fff), to(#000));

background-image:  -webkit-linear-gradient(#fff, #000);

background-image:  -moz-linear-gradient(#fff, #000);

background-image:  -o-linear-gradient(#fff, #000);

background-image:  linear-gradient(#fff, #000);

に変換される。

興味ある人は emmet ブランチで人柱お願いします。