Passing list elements as arguments to a mixin

Question

The following code works except for when I try to pass the $gradient to @include background-image.

@mixin compositeFill($size: 100p         


        

Answer 1

To pass a list of parameters to a mixin that accepts multiple parameters you would want to use it like this:

@include background-image(linear-gradient($gradient...));

the three dots indicate that you want to fill in the arguments from the list elements ... otherwise the whole list is passed as a single argument ... and the linear-gradient() mixin fails (as it expects at least two color stop arguments).

DEMO