stylesheets/animate/fade/_fadeOut.scss in animate-0.1.0 vs stylesheets/animate/fade/_fadeOut.scss in animate-0.2.beta.0

@@ -6,161 +6,206 @@
 @import "compass/css3/opacity";
 
 // ---------------------------------------------------------------------------
 // fadeOut
 
-@mixin animate-fadeOut($class: $default-animation-class-mode) {
-  $name: fadeOut;  
-  @include keyframes($name) {
-    0% {
-      opacity: 1; 
+@mixin animate-fadeOut(
+  $class      : $default-animation-class-mode,
+  $keyframes  : $default-keyframes-output
+) {
+  $name: fadeOut;
+  @if $keyframes {
+    @include keyframes($name) {
+      0% {
+        opacity: 1;
+      }
+      100% {
+        opacity: 0;
+      }
     }
-    100% {
-      opacity: 0; 
-    }
   }
   @include animation-class($name, $class) {}
 }
 
 // ---------------------------------------------------------------------------
 // fadeOutUp
 
-@mixin animate-fadeOutUp($class: $default-animation-class-mode) {
-  $name: fadeOutUp;  
-  @include keyframes($name) {
-    0% {
-      @include translateY(0);
-      opacity: 1; 
+@mixin animate-fadeOutUp(
+  $class      : $default-animation-class-mode,
+  $keyframes  : $default-keyframes-output
+) {
+  $name: fadeOutUp;
+  @if $keyframes {
+    @include keyframes($name) {
+      0% {
+        @include translateY(0);
+        opacity: 1;
+      }
+      100% {
+        @include translateY(-20px);
+        opacity: 0;
+      }
     }
-    100% {
-      @include translateY(-20px);
-      opacity: 0; 
-    } 
   }
   @include animation-class($name, $class) {}
 }
 
 // ---------------------------------------------------------------------------
 // fadeOutDown
 
-@mixin animate-fadeOutDown($class: $default-animation-class-mode) {
-  $name: fadeOutDown;  
-  @include keyframes($name) {
-    0% {
-      @include translateY(0);
-      opacity: 1; 
+@mixin animate-fadeOutDown(
+  $class      : $default-animation-class-mode,
+  $keyframes  : $default-keyframes-output
+) {
+  $name: fadeOutDown;
+  @if $keyframes {
+    @include keyframes($name) {
+      0% {
+        @include translateY(0);
+        opacity: 1;
+      }
+      100% {
+        @include translateY(20px);
+        opacity: 0;
+      }
     }
-    100% {
-      @include translateY(20px);
-      opacity: 0; 
-    } 
   }
   @include animation-class($name, $class) {}
 }
 
 // ---------------------------------------------------------------------------
 // fadeOutRight
 
-@mixin animate-fadeOutRight($class: $default-animation-class-mode) {
-  $name: fadeOutRight;  
-  @include keyframes($name) {
-    0% {
-      @include translateX(0);
-      opacity: 1; 
+@mixin animate-fadeOutRight(
+  $class      : $default-animation-class-mode,
+  $keyframes  : $default-keyframes-output
+) {
+  $name: fadeOutRight;
+  @if $keyframes {
+    @include keyframes($name) {
+      0% {
+        @include translateX(0);
+        opacity: 1;
+      }
+      100% {
+        @include translateX(20px);
+        opacity: 0;
+      }
     }
-    100% {
-      @include translateX(20px);
-      opacity: 0; 
-    } 
   }
   @include animation-class($name, $class) {}
 }
 
 // ---------------------------------------------------------------------------
 // fadeOutLeft
 
-@mixin animate-fadeOutLeft($class: $default-animation-class-mode) {
-  $name: fadeOutLeft;  
-  @include keyframes($name) {
-    0% {
-      @include translateX(0);
-      opacity: 1; 
+@mixin animate-fadeOutLeft(
+  $class      : $default-animation-class-mode,
+  $keyframes  : $default-keyframes-output
+) {
+  $name: fadeOutLeft;
+  @if $keyframes {
+    @include keyframes($name) {
+      0% {
+        @include translateX(0);
+        opacity: 1;
+      }
+      100% {
+        @include translateX(-20px);
+        opacity: 0;
+      }
     }
-    100% {
-      @include translateX(-20px);
-      opacity: 0; 
-    } 
   }
   @include animation-class($name, $class) {}
 }
 
 // ---------------------------------------------------------------------------
 // fadeOutUpBig
 
-@mixin animate-fadeOutUpBig($class: $default-animation-class-mode) {
-  $name: fadeOutUpBig;  
-  @include keyframes($name) {
-    0% {
-      @include translateY(0);
-      opacity: 1; 
+@mixin animate-fadeOutUpBig(
+  $class      : $default-animation-class-mode,
+  $keyframes  : $default-keyframes-output
+) {
+  $name: fadeOutUpBig;
+  @if $keyframes {
+    @include keyframes($name) {
+      0% {
+        @include translateY(0);
+        opacity: 1;
+      }
+      100% {
+        @include translateY(-2000px);
+        opacity: 0;
+      }
     }
-    100% {
-      @include translateY(-2000px);
-      opacity: 0; 
-    } 
   }
   @include animation-class($name, $class) {}
 }
 
 // ---------------------------------------------------------------------------
 // fadeOutDownBig
 
-@mixin animate-fadeOutDownBig($class: $default-animation-class-mode) {
-  $name: fadeOutDownBig;  
-  @include keyframes($name) {
-    0% {
-      opacity: 1;
-      @include translateY(0); 
+@mixin animate-fadeOutDownBig(
+  $class      : $default-animation-class-mode,
+  $keyframes  : $default-keyframes-output
+) {
+  $name: fadeOutDownBig;
+  @if $keyframes {
+    @include keyframes($name) {
+      0% {
+        opacity: 1;
+        @include translateY(0);
+      }
+      100% {
+        opacity: 0;
+        @include translateY(2000px);
+      }
     }
-    100% {
-      opacity: 0;
-      @include translateY(2000px); 
-    } 
   }
   @include animation-class($name, $class) {}
 }
 
 // ---------------------------------------------------------------------------
 // fadeOutRightBig
 
-@mixin animate-fadeOutRightBig($class: $default-animation-class-mode) {
-  $name: fadeOutRightBig;  
-  @include keyframes($name) {
-    0% {
-      opacity: 1;
-      @include translateX(0); 
+@mixin animate-fadeOutRightBig(
+  $class      : $default-animation-class-mode,
+  $keyframes  : $default-keyframes-output
+) {
+  $name: fadeOutRightBig;
+  @if $keyframes {
+    @include keyframes($name) {
+      0% {
+        opacity: 1;
+        @include translateX(0);
+      }
+      100% {
+        opacity: 0;
+        @include translateX(2000px);
+      }
     }
-    100% {
-      opacity: 0;
-      @include translateX(2000px); 
-    } 
   }
   @include animation-class($name, $class) {}
 }
 
 // ---------------------------------------------------------------------------
 // fadeOutLeftBig
 
-@mixin animate-fadeOutLeftBig($class: $default-animation-class-mode) {
-  $name: fadeOutLeftBig;  
-  @include keyframes($name) {
-    0% {
-      opacity: 1;
-      @include translateX(0); 
+@mixin animate-fadeOutLeftBig(
+  $class      : $default-animation-class-mode,
+  $keyframes  : $default-keyframes-output
+) {
+  $name: fadeOutLeftBig;
+  @if $keyframes {
+    @include keyframes($name) {
+      0% {
+        opacity: 1;
+        @include translateX(0);
+      }
+      100% {
+        opacity: 0;
+        @include translateX(-2000px);
+      }
     }
-    100% {
-      opacity: 0;
-      @include translateX(-2000px); 
-    } 
   }
   @include animation-class($name, $class) {}
 }
\ No newline at end of file