selector-max-type
Limit the number of type selectors in a selector.
a {}
/** ↑
* This type of selector */
Each selector in a selector list is evaluated separately.
In versions prior to 17.0.0, this rule would evaluate functional pseudo-classes separately, such as :not() and :is(), and resolve nested selectors (in a nonstandard way) before counting.
Options
number
Specify a maximum type selectors allowed.
Given:
{
"selector-max-type": 2
}
The following pattern is considered a problem:
div a span {}
The following patterns are not considered problems:
div {}
div a {}
.foo div a {}
div.foo a {}
Optional secondary options
ignore
{ "ignore": ["array", "of", "options"] }
"child"
Discount child type selectors.
Given:
{
"selector-max-type": [2, { "ignore": ["child"] }]
}
The following patterns are not considered problems:
div span > a {}
#bar div span > a {}
"compounded"
Discount compounded type selectors -- i.e. type selectors chained with other selectors.
Given:
{
"selector-max-type": [2, { "ignore": ["compounded"] }]
}
The following patterns are not considered problems:
div span a.foo {}
div span a#bar {}
"custom-elements"
Discount custom elements.
Given:
{
"selector-max-type": [2, { "ignore": ["custom-elements"] }]
}
The following pattern is not considered a problem:
div a foo-bar {}
"descendant"
Discount descendant type selectors.
Given:
{
"selector-max-type": [2, { "ignore": ["descendant"] }]
}
The following patterns are not considered problems:
.foo div span a {}
#bar div span a {}
"next-sibling"
Discount next-sibling type selectors.
Given:
{
"selector-max-type": [2, { "ignore": ["next-sibling"] }]
}
The following patterns are not considered problems:
div a + span {}
#bar + div + span + a + span {}
ignoreTypes
{ "ignoreTypes": ["array", "of", "types", "/regex/"] }
Given:
{
"selector-max-type": [2, { "ignoreTypes": ["/^my-/", "custom"] }]
}
The following patterns are not considered problems:
div a custom {}
div a my-type {}
div a my-other-type {}