メインコンテンツへスキップ

selector-nested-pattern

ルール内にネストされたルールのセレクターのパターンを指定します。

    a {
      color: orange;
      &:hover { color: pink; }
    } ↑
/**   ↑
 * This nested selector */

非標準セレクター（SassまたはLessの補間を含むセレクターなど）および at-rule 内にネストされたルールのセレクターは無視されます。

message セカンダリオプションは、このルールの引数を受け入れることができます。

オプション​

regex|string

文字列は new RegExp(yourString) のように RegExp に変換されます — そのため、適切にエスケープしてください。

セレクターの値は全体がチェックされます。コンビネーターとカンマを許可したい場合は、それらをパターンに組み込む必要があります。

文字列が与えられた場合

"^&:(?:hover|focus)$"

次のパターンは問題があるとみなされます

a {
  .bar {}
}
a {
  .bar:hover {}
}
a {
  &:hover,
  &:focus {}
}

次のパターンは問題があるとみなされません

a {
  &:hover {}
}
a {
  &:focus {}
}
a {
  &:hover {}
  &:focus {}
}

オプションのセカンダリオプション​

splitList: true | false (デフォルト: false)​

セレクターリストを個々のセレクターに分割します。

たとえば、trueの場合。

文字列が与えられた場合

"^&:(?:hover|focus)$"

次のパターンは問題があるとみなされます

a {
  .bar:hover,
  &:focus {}
}

次のパターンは問題があるとみなされません

a {
  &:hover,
  &:focus {}
}