compass-animate 0.0.1

data/stylesheets/animate/fadeInRightBig.scss

@@ -0,0 +1,33 @@
+@-webkit-keyframes fadeInRightBig {
+  0% {opacity: 0; -webkit-transform: translateX(2000px);}
+  100% {opacity: 1; -webkit-transform: translateX(0);}
+}
+
+@-moz-keyframes fadeInRightBig {
+  0% {opacity: 0; -moz-transform: translateX(2000px);}
+  100% {opacity: 1; -moz-transform: translateX(0);}
+}
+
+@-ms-keyframes fadeInRightBig {
+  0% {opacity: 0; -ms-transform: translateX(2000px);}
+  100% {opacity: 1; -ms-transform: translateX(0);}
+}
+
+@-o-keyframes fadeInRightBig {
+  0% {opacity: 0; -o-transform: translateX(2000px);}
+  100% {opacity: 1; -o-transform: translateX(0);}
+}
+
+@keyframes fadeInRightBig {
+  0% {opacity: 0; transform: translateX(2000px);}
+  100% {opacity: 1; transform: translateX(0);}
+}
+
+@mixin fadeInRightBig($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+  @include animation-name(fadeInRightBig);
+  @include duration($duration);
+  @include delay($delay);
+  @include function($function);
+  @include fill-mode($fill);
+  @include visibility($visibility);
+}

data/stylesheets/animate/fadeInUp.scss

@@ -0,0 +1,33 @@
+@-webkit-keyframes fadeInUp {
+  0% {opacity: 0; -webkit-transform: translateY(20px);}
+  100% {opacity: 1; -webkit-transform: translateY(0);}
+}
+
+@-moz-keyframes fadeInUp {
+  0% {opacity: 0; -moz-transform: translateY(20px);}
+  100% {opacity: 1; -moz-transform: translateY(0);}
+}
+
+@-ms-keyframes fadeInUp {
+  0% {opacity: 0; -ms-transform: translateY(20px);}
+  100% {opacity: 1; -ms-transform: translateY(0);}
+}
+
+@-o-keyframes fadeInUp {
+  0% {opacity: 0; -o-transform: translateY(20px);}
+  100% {opacity: 1; -o-transform: translateY(0);}
+}
+
+@keyframes fadeInUp {
+  0% {opacity: 0; transform: translateY(20px);}
+  100% {opacity: 1; transform: translateY(0);}
+}
+
+@mixin fadeInUp($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+  @include animation-name(fadeInUp);
+  @include duration($duration);
+  @include delay($delay);
+  @include function($function);
+  @include fill-mode($fill);
+  @include visibility($visibility);
+}

data/stylesheets/animate/fadeInUpBig.scss

@@ -0,0 +1,33 @@
+@-webkit-keyframes fadeInUpBig {
+  0% {opacity: 0; -webkit-transform: translateY(2000px);}
+  100% {opacity: 1; -webkit-transform: translateY(0);}
+}
+
+@-moz-keyframes fadeInUpBig {
+  0% {opacity: 0; -moz-transform: translateY(2000px);}
+  100% {opacity: 1; -moz-transform: translateY(0);}
+}
+
+@-ms-keyframes fadeInUpBig {
+  0% {opacity: 0; -ms-transform: translateY(2000px);}
+  100% {opacity: 1; -ms-transform: translateY(0);}
+}
+
+@-o-keyframes fadeInUpBig {
+  0% {opacity: 0; -o-transform: translateY(2000px);}
+  100% {opacity: 1; -o-transform: translateY(0);}
+}
+
+@keyframes fadeInUpBig {
+  0% {opacity: 0; transform: translateY(2000px);}
+  100% {opacity: 1; transform: translateY(0);}
+}
+
+@mixin fadeInUpBig($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+  @include animation-name(fadeInUpBig);
+  @include duration($duration);
+  @include delay($delay);
+  @include function($function);
+  @include fill-mode($fill);
+  @include visibility($visibility);
+}

data/stylesheets/animate/fadeOut.scss

@@ -0,0 +1,33 @@
+@-webkit-keyframes fadeOut {
+	0% {opacity: 1;}
+	100% {opacity: 0;}
+}
+
+@-moz-keyframes fadeOut {
+	0% {opacity: 1;}
+	100% {opacity: 0;}
+}
+
+@-ms-keyframes fadeOut {
+	0% {opacity: 1;}
+	100% {opacity: 0;}
+}
+
+@-o-keyframes fadeOut {
+	0% {opacity: 1;}
+	100% {opacity: 0;}
+}
+
+@keyframes fadeOut {
+	0% {opacity: 1;}
+	100% {opacity: 0;}
+}
+
+@mixin fadeOut($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+	@include animation-name(fadeOut);
+	@include duration($duration);
+	@include delay($delay);
+	@include function($function);
+	@include fill-mode($fill);
+	@include visibility($visibility);
+}

data/stylesheets/animate/fadeOutDown.scss

@@ -0,0 +1,33 @@
+@-webkit-keyframes fadeOutDown {
+  0% {opacity: 1; -webkit-transform: translateY(0);}
+  100% {opacity: 0; -webkit-transform: translateY(20px);}
+}
+
+@-moz-keyframes fadeOutDown {
+  0% {opacity: 1; -moz-transform: translateY(0);}
+  100% {opacity: 0; -moz-transform: translateY(20px);}
+}
+
+@-ms-keyframes fadeOutDown {
+  0% {opacity: 1; -ms-transform: translateY(0);}
+  100% {opacity: 0; -ms-transform: translateY(20px);}
+}
+
+@-o-keyframes fadeOutDown {
+  0% {opacity: 1; -o-transform: translateY(0);}
+  100% {opacity: 0; -o-transform: translateY(20px);}
+}
+
+@keyframes fadeOutDown {
+  0% {opacity: 1; transform: translateY(0);}
+  100% {opacity: 0; transform: translateY(20px);}
+}
+
+@mixin fadeOutDown($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+  @include animation-name(fadeOutDown);
+  @include duration($duration);
+  @include delay($delay);
+  @include function($function);
+  @include fill-mode($fill);
+  @include visibility($visibility);
+}

data/stylesheets/animate/fadeOutDownBig.scss

@@ -0,0 +1,33 @@
+@-webkit-keyframes fadeOutDownBig {
+  0% {opacity: 1; -webkit-transform: translateY(0);}
+  100% {opacity: 0; -webkit-transform: translateY(2000px);}
+}
+
+@-moz-keyframes fadeOutDownBig {
+  0% {opacity: 1; -moz-transform: translateY(0);}
+  100% {opacity: 0; -moz-transform: translateY(2000px);}
+}
+
+@-ms-keyframes fadeOutDownBig {
+  0% {opacity: 1; -ms-transform: translateY(0);}
+  100% {opacity: 0; -ms-transform: translateY(2000px);}
+}
+
+@-o-keyframes fadeOutDownBig {
+  0% {opacity: 1; -o-transform: translateY(0);}
+  100% {opacity: 0; -o-transform: translateY(2000px);}
+}
+
+@keyframes fadeOutDownBig {
+  0% {opacity: 1; transform: translateY(0);}
+  100% {opacity: 0; transform: translateY(2000px);}
+}
+
+@mixin fadeOutDownBig($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+  @include animation-name(fadeOutDownBig);
+  @include duration($duration);
+  @include delay($delay);
+  @include function($function);
+  @include fill-mode($fill);
+  @include visibility($visibility);
+}

data/stylesheets/animate/fadeOutLeft.scss

@@ -0,0 +1,33 @@
+@-webkit-keyframes fadeOutLeft {
+  0% {opacity: 1; -webkit-transform: translateX(0);}
+  100% {opacity: 0; -webkit-transform: translateX(-20px);}
+}
+
+@-moz-keyframes fadeOutLeft {
+  0% {opacity: 1; -moz-transform: translateX(0);}
+  100% {opacity: 0; -moz-transform: translateX(-20px);}
+}
+
+@-ms-keyframes fadeOutLeft {
+  0% {opacity: 1; -ms-transform: translateX(0);}
+  100% {opacity: 0; -ms-transform: translateX(-20px);}
+}
+
+@-o-keyframes fadeOutLeft {
+  0% {opacity: 1; -o-transform: translateX(0);}
+  100% {opacity: 0; -o-transform: translateX(-20px);}
+}
+
+@keyframes fadeOutLeft {
+  0% {opacity: 1; transform: translateX(0);}
+  100% {opacity: 0; transform: translateX(-20px);}
+}
+
+@mixin fadeOutLeft($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+  @include animation-name(fadeOutLeft);
+  @include duration($duration);
+  @include delay($delay);
+  @include function($function);
+  @include fill-mode($fill);
+  @include visibility($visibility);
+}

data/stylesheets/animate/fadeOutLeftBig.scss

@@ -0,0 +1,33 @@
+@-webkit-keyframes fadeOutLeftBig {
+  0% {opacity: 1; -webkit-transform: translateX(0);}
+  100% {opacity: 0; -webkit-transform: translateX(-2000px);}
+}
+
+@-moz-keyframes fadeOutLeftBig {
+  0% {opacity: 1; -moz-transform: translateX(0);}
+  100% {opacity: 0; -moz-transform: translateX(-2000px);}
+}
+
+@-ms-keyframes fadeOutLeftBig {
+  0% {opacity: 1; -ms-transform: translateX(0);}
+  100% {opacity: 0; -ms-transform: translateX(-2000px);}
+}
+
+@-o-keyframes fadeOutLeftBig {
+  0% {opacity: 1; -o-transform: translateX(0);}
+  100% {opacity: 0; -o-transform: translateX(-2000px);}
+}
+
+@keyframes fadeOutLeftBig {
+  0% {opacity: 1; transform: translateX(0);}
+  100% {opacity: 0; transform: translateX(-2000px);}
+}
+
+@mixin fadeOutLeftBig($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+  @include animation-name(fadeOutLeftBig);
+  @include duration($duration);
+  @include delay($delay);
+  @include function($function);
+  @include fill-mode($fill);
+  @include visibility($visibility);
+}

data/stylesheets/animate/fadeOutRight.scss

@@ -0,0 +1,33 @@
+@-webkit-keyframes fadeOutRight {
+  0% {opacity: 1; -webkit-transform: translateX(0);}
+  100% {opacity: 0; -webkit-transform: translateX(20px);}
+}
+
+@-moz-keyframes fadeOutRight {
+  0% {opacity: 1; -moz-transform: translateX(0);}
+  100% {opacity: 0; -moz-transform: translateX(20px);}
+}
+
+@-ms-keyframes fadeOutRight {
+  0% {opacity: 1; -ms-transform: translateX(0);}
+  100% {opacity: 0; -ms-transform: translateX(20px);}
+}
+
+@-o-keyframes fadeOutRight {
+  0% {opacity: 1; -o-transform: translateX(0);}
+  100% {opacity: 0; -o-transform: translateX(20px);}
+}
+
+@keyframes fadeOutRight {
+  0% {opacity: 1; transform: translateX(0);}
+  100% {opacity: 0; transform: translateX(20px);}
+}
+
+@mixin fadeOutRight($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+  @include animation-name(fadeOutRight);
+  @include duration($duration);
+  @include delay($delay);
+  @include function($function);
+  @include fill-mode($fill);
+  @include visibility($visibility);
+}

data/stylesheets/animate/fadeOutRightBig.scss

@@ -0,0 +1,33 @@
+@-webkit-keyframes fadeOutRightBig {
+  0% {opacity: 1; -webkit-transform: translateX(0);}
+  100% {opacity: 0; -webkit-transform: translateX(2000px);}
+}
+
+@-moz-keyframes fadeOutRightBig {
+  0% {opacity: 1; -moz-transform: translateX(0);}
+  100% {opacity: 0; -moz-transform: translateX(2000px);}
+}
+
+@-ms-keyframes fadeOutRightBig {
+  0% {opacity: 1; -ms-transform: translateX(0);}
+  100% {opacity: 0; -ms-transform: translateX(2000px);}
+}
+
+@-o-keyframes fadeOutRightBig {
+  0% {opacity: 1; -o-transform: translateX(0);}
+  100% {opacity: 0; -o-transform: translateX(2000px);}
+}
+
+@keyframes fadeOutRightBig {
+  0% {opacity: 1; transform: translateX(0);}
+  100% {opacity: 0; transform: translateX(2000px);}
+}
+
+@mixin fadeOutRightBig($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+  @include animation-name(fadeOutRightBig);
+  @include duration($duration);
+  @include delay($delay);
+  @include function($function);
+  @include fill-mode($fill);
+  @include visibility($visibility);
+}

data/stylesheets/animate/fadeOutUp.scss

@@ -0,0 +1,33 @@
+@-webkit-keyframes fadeOutUp {
+  0% {opacity: 1; -webkit-transform: translateY(0);}
+  100% {opacity: 0; -webkit-transform: translateY(-20px);}
+}
+
+@-moz-keyframes fadeOutUp {
+  0% {opacity: 1; -moz-transform: translateY(0);}
+  100% {opacity: 0; -moz-transform: translateY(-20px);}
+}
+
+@-ms-keyframes fadeOutUp {
+  0% {opacity: 1; -ms-transform: translateY(0);}
+  100% {opacity: 0; -ms-transform: translateY(-20px);}
+}
+
+@-o-keyframes fadeOutUp {
+  0% {opacity: 1; -o-transform: translateY(0);}
+  100% {opacity: 0; -o-transform: translateY(-20px);}
+}
+
+@keyframes fadeOutUp {
+  0% {opacity: 1; transform: translateY(0);}
+  100% {opacity: 0; transform: translateY(-20px);}
+}
+
+@mixin fadeOutUp($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+  @include animation-name(fadeOutUp);
+  @include duration($duration);
+  @include delay($delay);
+  @include function($function);
+  @include fill-mode($fill);
+  @include visibility($visibility);
+}

data/stylesheets/animate/fadeOutUpBig.scss

@@ -0,0 +1,28 @@
+@-webkit-keyframes fadeOutUpBig {
+  0% {opacity: 1; -webkit-transform: translateY(0);}
+  100% {opacity: 0; -webkit-transform: translateY(-2000px);}
+}
+
+@-moz-keyframes fadeOutUpBig {
+  0% {opacity: 1; -moz-transform: translateY(0);}
+  100% {opacity: 0; -moz-transform: translateY(-2000px);}
+}
+
+@-o-keyframes fadeOutUpBig {
+  0% {opacity: 1; -o-transform: translateY(0);}
+  100% {opacity: 0; -o-transform: translateY(-2000px);}
+}
+
+@keyframes fadeOutUpBig {
+  0% {opacity: 1; transform: translateY(0);}
+  100% {opacity: 0; transform: translateY(-2000px);}
+}
+
+@mixin fadeOutUpBig($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+  @include animation-name(fadeOutUpBig);
+  @include duration($duration);
+  @include delay($delay);
+  @include function($function);
+  @include fill-mode($fill);
+  @include visibility($visibility);
+}

data/stylesheets/animate/flash.scss

@@ -0,0 +1,33 @@
+@-webkit-keyframes flash {
+	0%, 50%, 100% {opacity: 1;}
+	25%, 75% {opacity: 0;}
+}
+
+@-moz-keyframes flash {
+	0%, 50%, 100% {opacity: 1;}
+	25%, 75% {opacity: 0;}
+}
+
+@-ms-keyframes flash {
+	0%, 50%, 100% {opacity: 1;}
+	25%, 75% {opacity: 0;}
+}
+
+@-o-keyframes flash {
+	0%, 50%, 100% {opacity: 1;}
+	25%, 75% {opacity: 0;}
+}
+
+@keyframes flash {
+	0%, 50%, 100% {opacity: 1;}
+	25%, 75% {opacity: 0;}
+}
+
+@mixin flash($duration: 1s, $delay: .2s, $function: ease, $fill: both, $visibility: hidden) {
+	@include animation-name(flash);
+  @include duration($duration);
+	@include delay($delay);
+	@include function($function);
+	@include fill-mode($fill);
+	@include visibility($visibility);
+}