Skip to main content

How to add extra elements before sub-element?

.component .inner-context .other-wrapperThe selector you want to insert .elementThe element you want to style

See example​

.toggle .inner-context .other-wrapperThe selector you want to insert .textThe element you want to style
+component('.toggle')
  +register
    +element('.text')

  display: inline-flex

  +_____________________
  +element('.text')
    +default
      display: inline-block
      margin-top: 0.25em

    +inner-context('.inner-context .other-wrapper')
      margin-top: 0.5em




.toggle {
  display: inline-flex;
}

.toggle .text {
  display: inline-block;
  margin-top: 0.25em;
}

.toggle .inner-context .other-wrapper .text {
  margin-top: 0.5em;
}

More info: +inner-context, +element, +register, +component, separator +___