animate-sass 0.1.0

data/stylesheets/animations/bouncing-entrances/_bounceInDown.scss

@@ -0,0 +1,37 @@
+@mixin bounceInDown($prefix) {
+  0% {
+    opacity: 0;
+    @include transform(translateY(-2000px), $prefix);
+  }
+  60% {
+    opacity: 1;
+    @include transform(translateY(30px), $prefix);
+  }
+  80% {
+    @include transform(translateY(-10px), $prefix);
+  }
+  100% {
+    @include transform(translateY(0), $prefix);
+  }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes bounceInDown { @include bounceInDown(webkit); }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes bounceInDown { @include bounceInDown(khtml); }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes bounceInDown { @include bounceInDown(moz); }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes bounceInDown { @include bounceInDown(ms); }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes bounceInDown { @include bounceInDown(o); }
+}
+@keyframes bounceInDown { @include bounceInDown(none); }
+
+.bounceInDown {
+  @include animation-name(bounceInDown);
+}

data/stylesheets/animations/bouncing-entrances/_bounceInLeft.scss

@@ -0,0 +1,37 @@
+@mixin bounceInLeft($prefix) {
+  0% {
+    opacity: 0;
+    @include transform(translateX(-2000px), $prefix);
+  }
+  60% {
+    opacity: 1;
+    @include transform(translateX(30px), $prefix);
+  }
+  80% {
+    @include transform(translateX(-10px), $prefix);
+  }
+  100% {
+    @include transform(translateX(0), $prefix);
+  }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes bounceInLeft { @include bounceInLeft(webkit); }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes bounceInLeft { @include bounceInLeft(khtml); }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes bounceInLeft { @include bounceInLeft(moz); }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes bounceInLeft { @include bounceInLeft(ms); }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes bounceInLeft { @include bounceInLeft(o); }
+}
+@keyframes bounceInLeft { @include bounceInLeft(none); }
+
+.bounceInLeft {
+  @include animation-name(bounceInLeft);
+}

data/stylesheets/animations/bouncing-entrances/_bounceInRight.scss

@@ -0,0 +1,37 @@
+@mixin bounceInRight($prefix) {
+  0% {
+    opacity: 0;
+    @include transform(translateX(2000px), $prefix);
+  }
+  60% {
+    opacity: 1;
+    @include transform(translateX(-30px), $prefix);
+  }
+  80% {
+    @include transform(translateX(10px), $prefix);
+  }
+  100% {
+    @include transform(translateX(0), $prefix);
+  }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes bounceInRight { @include bounceInRight(webkit); }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes bounceInRight { @include bounceInRight(khtml); }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes bounceInRight { @include bounceInRight(moz); }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes bounceInRight { @include bounceInRight(ms); }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes bounceInRight { @include bounceInRight(o); }
+}
+@keyframes bounceInRight { @include bounceInRight(none); }
+
+.bounceInRight {
+  @include animation-name(bounceInRight);
+}

data/stylesheets/animations/bouncing-entrances/_bounceInUp.scss

@@ -0,0 +1,37 @@
+@mixin bounceInUp($prefix) {
+  0% {
+    opacity: 0;
+    @include transform(translateY(2000px), $prefix);
+  }
+  60% {
+    opacity: 1;
+    @include transform(translateY(-30px), $prefix);
+  }
+  80% {
+    @include transform(translateY(10px), $prefix);
+  }
+  100% {
+    @include transform(translateY(0), $prefix);
+  }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes bounceInUp { @include bounceInUp(webkit); }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes bounceInUp { @include bounceInUp(khtml); }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes bounceInUp { @include bounceInUp(moz); }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes bounceInUp { @include bounceInUp(ms); }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes bounceInUp { @include bounceInUp(o); }
+}
+@keyframes bounceInUp { @include bounceInUp(none); }
+
+.bounceInUp {
+  @include animation-name(bounceInUp);
+}

data/stylesheets/animations/bouncing-exits/_bounceOut.scss

@@ -0,0 +1,37 @@
+@mixin bounceOut($prefix) {
+  0% {
+    @include transform(scale(1), $prefix);
+  }
+  25% {
+    @include transform(scale(0.95), $prefix);
+  }
+  50% {
+    opacity: 1;
+    @include transform(scale(1.1), $prefix);
+  }
+  100% {
+    opacity: 0;
+    @include transform(scale(0.3), $prefix);
+  }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes bounceOut { @include bounceOut(webkit); }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes bounceOut { @include bounceOut(khtml); }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes bounceOut { @include bounceOut(moz); }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes bounceOut { @include bounceOut(ms); }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes bounceOut { @include bounceOut(o); }
+}
+@keyframes bounceOut { @include bounceOut(none); }
+
+.bounceOut {
+  @include animation-name(bounceOut);
+}

data/stylesheets/animations/bouncing-exits/_bounceOutDown.scss

@@ -0,0 +1,34 @@
+@mixin bounceOutDown($prefix) {
+  0% {
+    @include transform(translateY(0), $prefix);
+  }
+  20% {
+    opacity: 1;
+    @include transform(translateY(-20px), $prefix);
+  }
+  100% {
+    opacity: 0;
+    @include transform(translateY(2000px), $prefix);
+  }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes bounceOutDown { @include bounceOutDown(webkit); }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes bounceOutDown { @include bounceOutDown(khtml); }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes bounceOutDown { @include bounceOutDown(moz); }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes bounceOutDown { @include bounceOutDown(ms); }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes bounceOutDown { @include bounceOutDown(o); }
+}
+@keyframes bounceOutDown { @include bounceOutDown(none); }
+
+.bounceOutDown {
+  @include animation-name(bounceOutDown);
+}

data/stylesheets/animations/bouncing-exits/_bounceOutLeft.scss

@@ -0,0 +1,34 @@
+@mixin bounceOutLeft($prefix) {
+  0% {
+    @include transform(translateX(0), $prefix);
+  }
+  20% {
+    opacity: 1;
+    @include transform(translateX(20px), $prefix);
+  }
+  100% {
+    opacity: 0;
+    @include transform(translateX(-2000px), $prefix);
+  }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes bounceOutLeft { @include bounceOutLeft(webkit); }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes bounceOutLeft { @include bounceOutLeft(khtml); }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes bounceOutLeft { @include bounceOutLeft(moz); }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes bounceOutLeft { @include bounceOutLeft(ms); }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes bounceOutLeft { @include bounceOutLeft(o); }
+}
+@keyframes bounceOutLeft { @include bounceOutLeft(none); }
+
+.bounceOutLeft {
+  @include animation-name(bounceOutLeft);
+}

data/stylesheets/animations/bouncing-exits/_bounceOutRight.scss

@@ -0,0 +1,34 @@
+@mixin bounceOutRight($prefix) {
+  0% {
+    @include transform(translateX(0), $prefix);
+  }
+  20% {
+    opacity: 1;
+    @include transform(translateX(-20px), $prefix);
+  }
+  100% {
+    opacity: 0;
+    @include transform(translateX(2000px), $prefix);
+  }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes bounceOutRight { @include bounceOutRight(webkit); }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes bounceOutRight { @include bounceOutRight(khtml); }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes bounceOutRight { @include bounceOutRight(moz); }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes bounceOutRight { @include bounceOutRight(ms); }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes bounceOutRight { @include bounceOutRight(o); }
+}
+@keyframes bounceOutRight { @include bounceOutRight(none); }
+
+.bounceOutRight {
+  @include animation-name(bounceOutRight);
+}

data/stylesheets/animations/bouncing-exits/_bounceOutUp.scss

@@ -0,0 +1,34 @@
+@mixin bounceOutUp($prefix) {
+  0% {
+    @include transform(translateY(0), $prefix);
+  }
+  20% {
+    opacity: 1;
+    @include transform(translateY(20px), $prefix);
+  }
+  100% {
+    opacity: 0;
+    @include transform(translateY(-2000px), $prefix);
+  }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes bounceOutUp { @include bounceOutUp(webkit); }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes bounceOutUp { @include bounceOutUp(khtml); }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes bounceOutUp { @include bounceOutUp(moz); }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes bounceOutUp { @include bounceOutUp(ms); }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes bounceOutUp { @include bounceOutUp(o); }
+}
+@keyframes bounceOutUp { @include bounceOutUp(none); }
+
+.bounceOutUp {
+  @include animation-name(bounceOutUp);
+}

data/stylesheets/animations/fading-entrances/_fadeIn.scss

@@ -0,0 +1,25 @@
+@mixin fadeIn {
+  0% { opacity: 0; }
+  100% { opacity: 1; }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes fadeIn { @include fadeIn; }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes fadeIn { @include fadeIn; }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes fadeIn { @include fadeIn; }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes fadeIn { @include fadeIn; }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes fadeIn { @include fadeIn; }
+}
+@keyframes fadeIn { @include fadeIn; }
+
+.fadeIn {
+  @include animation-name(fadeIn);
+}

data/stylesheets/animations/fading-entrances/_fadeInDown.scss

@@ -0,0 +1,31 @@
+@mixin fadeInDown($prefix) {
+  0% {
+    opacity: 0;
+    @include transform(translateY(-20px), $prefix);
+  }
+  100% {
+    opacity: 1;
+    @include transform(translateY(0), $prefix);
+  }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes fadeInDown { @include fadeInDown(webkit); }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes fadeInDown { @include fadeInDown(khtml); }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes fadeInDown { @include fadeInDown(moz); }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes fadeInDown { @include fadeInDown(ms); }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes fadeInDown { @include fadeInDown(o); }
+}
+@keyframes fadeInDown { @include fadeInDown(none); }
+
+.fadeInDown {
+  @include animation-name(fadeInDown);
+}

data/stylesheets/animations/fading-entrances/_fadeInDownBig.scss

@@ -0,0 +1,31 @@
+@mixin fadeInDownBig($prefix) {
+  0% {
+    opacity: 0;
+    @include transform(translateY(-2000px), $prefix);
+  }
+  100% {
+    opacity: 1;
+    @include transform(translateY(0), $prefix);
+  }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes fadeInDownBig { @include fadeInDownBig(webkit); }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes fadeInDownBig { @include fadeInDownBig(khtml); }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes fadeInDownBig { @include fadeInDownBig(moz); }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes fadeInDownBig { @include fadeInDownBig(ms); }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes fadeInDownBig { @include fadeInDownBig(o); }
+}
+@keyframes fadeInDownBig { @include fadeInDownBig(none); }
+
+.fadeInDownBig {
+  @include animation-name(fadeInDownBig);
+}

data/stylesheets/animations/fading-entrances/_fadeInLeft.scss

@@ -0,0 +1,31 @@
+@mixin fadeInLeft($prefix) {
+  0% {
+    opacity: 0;
+    @include transform(translateX(-20px), $prefix);
+  }
+  100% {
+    opacity: 1;
+    @include transform(translateX(0), $prefix);
+  }
+}
+
+@if $experimental-support-for-webkit {
+  @-webkit-keyframes fadeInLeft { @include fadeInLeft(webkit); }
+}
+@if $experimental-support-for-khtml {
+  @-khtml-keyframes fadeInLeft { @include fadeInLeft(khtml); }
+}
+@if $experimental-support-for-mozilla {
+  @-moz-keyframes fadeInLeft { @include fadeInLeft(moz); }
+}
+@if $experimental-support-for-microsoft {
+  @-ms-keyframes fadeInLeft { @include fadeInLeft(ms); }
+}
+@if $experimental-support-for-opera {
+  @-o-keyframes fadeInLeft { @include fadeInLeft(o); }
+}
+@keyframes fadeInLeft { @include fadeInLeft(none); }
+
+.fadeInLeft {
+  @include animation-name(fadeInLeft);
+}