Sha256: f2d2a3208b5de2b498cdca7c45952c4b78c0de0c09fbe53fd0637163605e11a1
Contents?: true
Size: 1.38 KB
Versions: 8
Compression:
Stored size: 1.38 KB
Contents
// ---------------------------------------------------------------------------
// imports
@import "compass/css3/animation";
@import "compass/css3/transform";
@import "compass/css3/opacity";
// ---------------------------------------------------------------------------
// hinge
@mixin animate-hinge(
$class : $default-animation-class-mode,
$keyframes : $default-keyframes-output
) {
$name: hinge;
@if $keyframes {
@include keyframes($name) {
0% {
@include rotate(0);
@include transform-origin(top, left);
@include animation-timing-function(ease-in-out);
}
20%, 60% {
@include rotate(80deg);
@include transform-origin(top, left);
@include animation-timing-function(ease-in-out);
}
40% {
@include rotate(60deg);
@include transform-origin(top, left);
@include animation-timing-function(ease-in-out);
}
80% {
@include transform(rotate(60deg) translateY(0));
@include opacity(1);
@include transform-origin(top, left);
@include animation-timing-function(ease-in-out);
}
100% {
@include translateY(700px);
@include opacity(0);
}
}
}
@include animation-class($name, $class) {
$selector: if($class == 'silent', '%animated', '.animated');
&#{$selector} { @include animation($name 2s ease both); }
}
}
Version data entries
8 entries across 8 versions & 1 rubygems