カテゴリー : Stylus

[Stylus] Lost img selector in nested selectors

Stylus のバージョンを 0.40.3 にあげたら、バグに遭遇しました。

LearnBoost/stylus

変にコンパイルされる書き方

Stylus

.circle
  img
  .cap-overlay
  .cap-soldout
    border-radius: 200px

↓ コンパイルすると、img にクラスが当たらない

CSS

.circle .cap-overlay,.circle .cap-soldout{
  -webkit-border-radius:200px;border-radius:200px
}

正しくコンパイルされる書き方

Stylus

.circle
  .cap-overlay
  .cap-soldout
  img
    border-radius: 200px

↓ ちゃんと、img も含まれてる

CSS

.circle .cap-overlay,.circle .cap-soldout,.circle img{
  -webkit-border-radius:200px;border-radius:200px
}

とりあえず、issueだけ作成しておきました。

Lost img selector in nested selectors · Issue #1226 · LearnBoost/stylus