CODEWITHSUNDEEP
cssstylus
gzhegow
gzhegow

Reputation: 57

Stylus empty text variable

How to create stylus EMPTY text variable?

$cross(prop)
  prop = shift(arguments)
  -webkit-{prop} arguments
  -moz-{prop} arguments
  -ms-{prop} arguments
  -o-{prop} arguments
  {prop} arguments

$transition()
  attrs = shift(arguments)
  if length(arguments)
    str = ????WTF???
    for arg in arguments
      if length(str)
        str += \,
      str += arg attrs
    $cross (transition) (str)

I want to create transition mixin:

$transition((.4s ease out), opacity, visibility)

Upvotes: 1

Views: 583

Answers (1)

Panya
Panya

Reputation: 2699

Unfortunately, the length bif can only be used for lists/hashes. It always returns 1 for other nodes. You can write something like this instead:

$transition()
  attrs = shift(arguments)
  if length(arguments)
    str = ''
    for arg in arguments
      if str != ''
        str += ', '
      str += arg, attrs
    $cross (transition) unquote(str) // unquote to remove quotes

Or you can write a custom function to get string length:

str-length.js

module.exports = function() {
  return function(stylus) {
    stylus.define('str-length', function(str) {
      return str.val.length;
    });
  };
};

test.styl

use('str-length.js')

$cross(prop)
  prop = shift(arguments)
  -webkit-{prop} arguments
  -moz-{prop} arguments
  -ms-{prop} arguments
  -o-{prop} arguments
  {prop} arguments

$transition()
  attrs = shift(arguments)
  if length(arguments)
    str = ''
    for arg in arguments
      if str-length(str)
        str += ', '
      str += arg attrs
    $cross (transition) unquote(str) // unquote to remove quotes

body
  $transition((.4s ease out), opacity, visibility)

Upvotes: 1

Related Questions