Are mixin parenthesis optional when nested?

Question

Consider the following:

.flashing {

    .flashKeyFrames(fade-in;{
        0%, 100% {opacity: 1;}
        50% {opacity: 0;}
        });

    .flashing(fade-in linear infinite alternate; 1s)

}

.flashKeyFrames(@name; @arguments) {
    @-moz-keyframes @name { @arguments(); }
    @-webkit-keyframes @name { @arguments(); }
    @keyframes @name { @arguments(); }
}

.flashing(@arguments, @duration) {
    -webkit-animation: @arguments;
    -moz-animation: @arguments;
    animation: @arguments;

    -webkit-animation-duration: @duration;
    -moz-animation-duration: @duration;
    animation-duration: @duration;
}

What are the parenthesis necessarily after @arguments? I thought parenthesis were optional when used as mixins? So I'm assuming @arguments isn't being defined as a mixin, but then what is it?

score 1 · Accepted Answer · answered May 04 '16 at 10:04

No, the @arguments used in the .flashKeyFrames is not a mixin. It is an argument that is passed to the mixin. The value set that is set to this argument is a detached ruleset and for a detached ruleset call to work, the parentheses () at the end is mandatory. Below is the extract from the Less website:

Parentheses after a detached ruleset call are mandatory. The call @detached-ruleset; would NOT work.

Parentheses are not optional only when calling a mixin and not a ruleset.

Are mixin parenthesis optional when nested?

1 Answers1