Skip to main content

How to declare a variant with :is() condition on sub-element?

.component .elementThe element you want to style:is(.sub-element)The selector you want to insert
+component('article')
+register
+element('.header')
+variant(':is(.emoji, .new)')

display: inline-flex

+__________________________________
+element('.header')
+default
font-size: 1em

+variant(':is(.emoji, .new)')
font-size: 2em





article {
display: inline-flex;
}

article .header {
font-size: 1em;
}

article .header:is(.emoji, .new) {
font-size: 2em;
}

More info: +variant, +default, +element, +register, +component, separator +___