Reputation: 15
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?
Upvotes: 1
Views: 237
Reputation: 89750
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.
Upvotes: 1