Sha256: 5c3956eaa2f1a67ed8d0d3812e8fbe880c5de3aa3d47b5f11cb020e93df89452
Contents?: true
Size: 1.7 KB
Versions: 9
Compression:
Stored size: 1.7 KB
Contents
// ---------------------------------------------------------------------------
// imports
@import "compass/css3/animation";
@import "compass/css3/opacity";
// ---------------------------------------------------------------------------
// flipOut [ x | y | all ]
@mixin animate-flipOut(
$sub : all,
$class : $default-animation-class-mode,
$keyframes : $default-keyframes-output
) {
$sub : compact($sub);
$x : yepnope($sub, all x);
$y : yepnope($sub, all y);
@if $x { @include animate-flipOutX (all, $class, $keyframes); }
@if $y { @include animate-flipOutY (all, $class, $keyframes); }
}
// ---------------------------------------------------------------------------
// flipOutX
@mixin animate-flipOutX(
$class : $default-animation-class-mode,
$keyframes : $default-keyframes-output
) {
$name: flipOutX;
@if $keyframes {
@include keyframes($name) {
0% {
@include transform(perspective(400px) rotateX(0deg));
@include opacity(1);
}
100% {
@include transform(perspective(400px) rotateX(90deg));
@include opacity(0);
}
}
}
@include flip-class($name, $class);
}
// ---------------------------------------------------------------------------
// flipOutY
@mixin animate-flipOutY(
$class : $default-animation-class-mode,
$keyframes : $default-keyframes-output
) {
$name: flipOutY;
@if $keyframes {
@include keyframes($name) {
0% {
@include transform(perspective(400px) rotateY(0deg));
@include opacity(1);
}
100% {
@include transform(perspective(400px) rotateY(90deg));
@include opacity(0);
}
}
}
@include flip-class($name, $class);
}
Version data entries
9 entries across 9 versions & 2 rubygems