Skip to main content

How to declare a sub-element with :not() selector?

.component The selector you want to insertbutton:not(.btn)The element you want to style
+component('#footer')
  +register
    +variant('.mini')
    +element('button:not(.btn)')

  display: flex

  +____________________________
  +element('button:not(.btn)')
    +default
      display: inline-flex
      font-size: 1.25em

    +variant('.mini')
      font-size: 0.75em





#footer {
  display: flex;
}

#footer button:not(.btn) {
  display: inline-flex;
  font-size: 1.25em;
}

#footer.mini button:not(.btn) {
  font-size: 0.75em;
}

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