Syntax¶

Description: non is defined as a negation pseudo-class.

ctr('<#selector>', {
  non: {
    key: '<identifier>'
    <...>: <...>
  }
})

<#selector>:
  non:
    key: <identifier>
    <...>: <...>

<#selector>:not(<identifier>) {
  <...>: <...>;
}

Notes

• Regex Match: /^non$|^not$|^nons$|^non-|^not-|^customNo/i
• MDN :not()

Basic¶

Description: The non Object creates a negation pseudo-class for the <identifier> at the scope level it is defined.

ctr('.test', {
  width: 200px
  non: {
    key: 'p'
    font-size: 1em
  }
})

.test:
  width: 200px
  non:
    key: p
    font-size: 1em

.test {
  width: 200px;
}
.test:not(p) {
  font-size: 1em;
}

ctr('.test', {
  width: 200px
  non: {
    key: 'p'
    font-size: 1em
  }
})

.test {
  width: 200px;
}
.test:not(p) {
  font-size: 1em;
}

.test:
  width: 200px
  non:
    key: p
    font-size: 1em

Notes

• non alias: 'not'
  • Since not is a Stylus keyword you can not use it in the Literal form and it must be a String otherwise Stylus throws a nasty parser error
• The key property can be defined inside or outside the option Object