Uri Klar
Uri Klar

Reputation: 3988

Compass animation mixin with multiple animations

I’m trying to use Compass animation mixin with multiple animations. Is this possible?

I’ve tried @include animation(an-1 5s infinite, an-2 10s infinite), but I’m getting an error: Mixin animation takes 1 argument but 2 were passed.

Upvotes: 1

Views: 552

Answers (1)

Dirk
Dirk

Reputation: 392

Your compass syntax is correct and works in the current version of compass. Maybe this wasn’t the case in a previous version.

Demo on Codepen

Though you can always combine both animations into one (if both animations should use the exact same options, e.g. easing):

@include animation(an-3 5s ease-in infinite);

@include keyframes(an-3) {
    from {
      transform: scaleY(0);
      opacity: 0;
    }
    to {
      transform: scaleY(1);
      opacity: 1;
    }
}

Upvotes: 1

Related Questions