Home/ Questions/Q 8781837
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T20:24:40+00:00

Making a mixin for properties like border-radius is easy: vendor(name, args) -webkit-{name} args -moz-{name}

  • 0

Making a mixin for properties like border-radius is easy:

vendor(name, args)
    -webkit-{name} args
    -moz-{name} args
    -ie-{name} args
    -o-{name} args
    {name} args

border-radius()
    vendor('border-radius', arguments)

#test
    border-radius 5px

But what if I want to create a transparent vendor mixin for linear-gradient? Unlike border-radius, linear-gradient is not a property but an argument, e.g.

#test
    background-image linear-gradient(top, #f00 0%, #00f 100%)

I’m thinking I have to create a mixin called background-image and check if the first argument is linear-gradient. Is Stylus capable of such advanced logic? If so, how can I accomplish what I’m trying to do?

Thanks for any help on the matter.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Are you familiar with the nib project? http://visionmedia.github.com/nib/ It has all of the mixins you would want for stylus. Even if you don’t end up using nib, you can still look at their code (https://github.com/visionmedia/nib/blob/master/lib/nib/gradients.styl#L106 for linear-gradient)

    • 0