How to add conditional !important in stylus

stylus

Solution

Answering your question — you can just use `unquote()` around the quotes for `importantString`, so it would output to nothing if there is no `important`.

That would look like this:

fontSize(size, isImportant = false)
  importantString = isImportant ? !important : unquote("")

  font-size unit(size, 'px') importantString
  font-size unit(size / 10, 'rem') importantString

However! if you'd ask me, I'd recommend to make something different — make a transparent mixin for `font-size` like this:

font-size(size, args...)
  $rem_ratio = 10 if not $rem_ratio is defined
  if unit(size) == 'rem'
    font-size unit(size * $rem_ratio, 'px') args
    font-size size args
  else if unit(size) == ''
    font-size unit(size, 'px') args
    font-size unit(size / $rem_ratio, 'rem') args
  else
    font-size arguments

That mixin could be used transparently as you could use the generic `font-size`. Even more, there are two ways to use it:

.foo
  font-size 1rem

.bar
  font-size 10

You can use `rem` unit there, that would be translated to pixels in a fallback, or use unitless number, that would be translated as you wanted it to be in your question. And the importance would be preserved and you'd even have a way to declare how much pixels are there in one `rem` using `$rem_ratio` variable.

Enjoy!

Problem

I want to add a conditional `!important` string to a definition without having to duplicate the lines... The closest I've come so far is this: ``` fontSize(size, isImportant = false) importantString="" if isImportant importantString = !important font-size unit(size, 'px') importantString font-size unit(size / 10, 'rem') importantString ``` which doesn't work because `importantString=""` actually inserts `""`, and removing the assignment actually prints `importantString` if it isn't defined. The best way would be something like: ``` font-size unit(size, 'px') if isImportant !important ``` But I guess that's not possible.

Original source