saffron 0.2.2 → 0.2.3

data/saffron/exits/_fade-out-up.scss

@@ -1,14 +1,14 @@
-@include keyframes(fadeOutUp) {
+@include u-keyframes(fadeOutUp) {
   0% {
     opacity: 1;
-    @include transform(translateZ(0));
+    @include u-transform(translateZ(0));
   }
   100% {
     opacity: 0;
-    @include transform(translateY($saf-translateY-distance * -1));
+    @include u-transform(translateY($saf-translateY-distance * -1));
   }
 }
 
 @mixin fadeOutUp($duration: 1s, $delay: 0s, $fill-mode: forwards) {
-  @include animation(fadeOutUp $duration $delay $fill-mode);
+  @include u-animation(fadeOutUp $duration $delay $fill-mode);
 }

data/saffron/exits/_fade-out-zoom-big.scss

@@ -1,19 +1,19 @@
-@include keyframes(fadeOutZoomBig) {
+@include u-keyframes(fadeOutZoomBig) {
   0% {
-    @include transform(scale(1) translateZ(0));
+    @include u-transform(scale(1) translateZ(0));
   }
   40% {
-    @include transform(scale(1.25));
+    @include u-transform(scale(1.25));
   }
   60% {
     opacity: 1;
   }
   100% {
     opacity: 0;
-    @include transform(scale(0));
+    @include u-transform(scale(0));
   }
 }
 
 @mixin fadeOutZoomBig($duration: 1s, $delay: 0s, $fill-mode: forwards) {
-  @include animation(fadeOutZoomBig $duration $delay $fill-mode);
+  @include u-animation(fadeOutZoomBig $duration $delay $fill-mode);
 }

data/saffron/exits/_fade-out-zoom.scss

@@ -1,14 +1,14 @@
-@include keyframes(fadeOutZoom) {
+@include u-keyframes(fadeOutZoom) {
   0% {
     opacity: 1;
-    @include transform(translateZ(0));
+    @include u-transform(translateZ(0));
   }
   100% {
     opacity: 0;
-    @include transform(scale(0));
+    @include u-transform(scale(0));
   }
 }
 
 @mixin fadeOutZoom($duration: 1s, $delay: 0s, $fill-mode: forwards) {
-  @include animation(fadeOutZoom $duration $delay $fill-mode);
+  @include u-animation(fadeOutZoom $duration $delay $fill-mode);
 }

data/saffron/exits/_fade-out.scss

@@ -1,7 +1,7 @@
-@include keyframes(fadeOut) {
+@include u-keyframes(fadeOut) {
   0% {
     opacity: 1;
-    @include transform(translateZ(0));
+    @include u-transform(translateZ(0));
   }
   100% {
     opacity: 0;
@@ -9,5 +9,5 @@
 }
 
 @mixin fadeOut($duration: 1s, $delay: 0s, $fill-mode: forwards) {
-  @include animation(fadeOut $duration $delay $fill-mode);
+  @include u-animation(fadeOut $duration $delay $fill-mode);
 }

data/saffron/exits/_poof.scss

@@ -1,17 +1,17 @@
-@include keyframes(poof) {
+@include u-keyframes(poof) {
   0% {
     opacity: 1;
-    @include transform(scale(1));
+    @include u-transform(scale(1));
     -webkit-filter: blur(0);
   }
 
   100% {
     opacity: 0;
-    @include transform(scale(2));
+    @include u-transform(scale(2));
     -webkit-filter: blur(40px);
   }
 }
 
 @mixin poof($duration: 0.85s, $delay: 0s, $fill-mode: forwards) {
-  @include animation(poof $duration $delay $fill-mode);
+  @include u-animation(poof $duration $delay $fill-mode);
 }

data/saffron/exits/_rise-out.scss

@@ -1,14 +1,14 @@
-@include keyframes(riseOut) {
+@include u-keyframes(riseOut) {
   0% {
     opacity: 1;
-    @include transform(translateZ(0));
+    @include u-transform(translateZ(0));
   }
   100% {
     opacity: 0;
-    @include transform(translateY($saf-drop-rise-distance * -1));
+    @include u-transform(translateY($saf-drop-rise-distance * -1));
   }
 }
 
 @mixin riseOut($duration: 0.5s, $delay: 0s, $fill-mode: forwards) {
-  @include animation(riseOut $duration $delay $fill-mode);
+  @include u-animation(riseOut $duration $delay $fill-mode);
 }

data/saffron/exits/_slide-out.scss

@@ -1,29 +1,29 @@
-@include keyframes(slideOutLeft) {
+@include u-keyframes(slideOutLeft) {
   35% {
     opacity: 1;
-    @include transform(translateX($saf-translateX-distance) translateZ(0));
+    @include u-transform(translateX($saf-translateX-distance) translateZ(0));
   }
   100% {
     opacity: 0;
-    @include transform(translateX($saf-translateX-distance * -10));
+    @include u-transform(translateX($saf-translateX-distance * -10));
   }
 }
 
 @mixin slideOutLeft($duration: 1s, $delay: 0s, $fill-mode: forwards) {
-  @include animation(slideOutLeft $duration $delay $fill-mode);
+  @include u-animation(slideOutLeft $duration $delay $fill-mode);
 }
 
-@include keyframes(slideOutRight) {
+@include u-keyframes(slideOutRight) {
   35% {
     opacity: 1;
-    @include transform(translateX($saf-translateX-distance * -1) translateZ(0));
+    @include u-transform(translateX($saf-translateX-distance * -1) translateZ(0));
   }
   100% {
     opacity: 0;
-    @include transform(translateX($saf-translateX-distance * 10));
+    @include u-transform(translateX($saf-translateX-distance * 10));
   }
 }
 
 @mixin slideOutRight($duration: 1s, $delay: 0s, $fill-mode: forwards) {
-  @include animation(slideOutRight $duration $delay $fill-mode);
+  @include u-animation(slideOutRight $duration $delay $fill-mode);
 }

data/saffron/exits/_turn-out.scss

@@ -1,33 +1,33 @@
-@include keyframes(turnOutDown) {
+@include u-keyframes(turnOutDown) {
   0% {
     opacity: 1;
-    @include transform(perspective(800px) rotateX(0deg) translateZ(0));
-    @include prefix(backface-visibility, hidden, webkit spec);
+    @include u-transform(perspective(800px) rotateX(0deg) translateZ(0));
+    @include u-prefix(backface-visibility, hidden, webkit spec);
   }
 
   100% {
     opacity: 0;
-    @include transform(perspective(500px) rotateX($saf-turn-angle * -1) translateZ(150px));
+    @include u-transform(perspective(500px) rotateX($saf-turn-angle * -1) translateZ(150px));
   }
 }
 
 @mixin turnOutDown($duration: 1s, $delay: 0s, $fill-mode: forwards) {
-  @include animation(turnOutDown $duration $delay $fill-mode);
+  @include u-animation(turnOutDown $duration $delay $fill-mode);
 }
 
-@include keyframes(turnOutUp) {
+@include u-keyframes(turnOutUp) {
   0% {
     opacity: 1;
-    @include transform(perspective(800px) rotateX(0deg) translateZ(0));
-    @include prefix(backface-visibility, hidden, webkit spec);
+    @include u-transform(perspective(800px) rotateX(0deg) translateZ(0));
+    @include u-prefix(backface-visibility, hidden, webkit spec);
   }
 
   100% {
     opacity: 0;
-    @include transform(perspective(500px) rotateX($saf-turn-angle) translateZ(150px));
+    @include u-transform(perspective(500px) rotateX($saf-turn-angle) translateZ(150px));
   }
 }
 
 @mixin turnOutUp($duration: 1s, $delay: 0s, $fill-mode: forwards) {
-  @include animation(turnOutUp $duration $delay $fill-mode);
+  @include u-animation(turnOutUp $duration $delay $fill-mode);
 }

data/saffron/helpers/_animation.scss

@@ -1,3 +1,3 @@
-@mixin animation($properties...) {
-  @include prefix(animation, $properties, webkit spec);
+@mixin u-animation($properties...) {
+  @include u-prefix(animation, $properties, webkit spec);
 }

data/saffron/helpers/_contains.scss

@@ -1,4 +1,4 @@
 // Thanks to @lunelson and @zaus
-@function contains($list, $var) {
+@function u-contains($list, $var) {
   @return (false != index($list, $var));
 }

data/saffron/helpers/_keyframes.scss

@@ -1,23 +1,23 @@
-@mixin keyframes($name) {
+@mixin u-keyframes($name) {
   @each $prefix in $saf-prefixes {
     @if $prefix == "webkit" {
       @-webkit-keyframes #{$name} {
-        @include prefix-only($prefix);
+        @include u-prefix-only($prefix);
         @content;
       }
     } @else if $prefix == "moz" {
       @-moz-keyframes #{$name} {
-        @include prefix-only($prefix);
+        @include u-prefix-only($prefix);
         @content;
       }
     } @else if $prefix == "o" {
       @-o-keyframes #{$name} {
-        @include prefix-only($prefix);
+        @include u-prefix-only($prefix);
         @content;
       }
     } @else if $prefix == "spec" {
       @keyframes #{$name} {
-        @include prefix-all();
+        @include u-prefix-all();
         @content;
       }
     }

data/saffron/helpers/_prefix.scss

@@ -1,4 +1,4 @@
-@mixin prefix($property, $value, $prefixes: $saf-prefixes) {
+@mixin u-prefix($property, $value, $prefixes: $saf-prefixes) {
   @each $prefix in $prefixes {
     @if $prefix == "webkit" {
       -webkit-#{$property}: #{$value};
@@ -16,7 +16,7 @@
   }
 }
 
-@mixin prefix-all($value: true){
+@mixin u-prefix-all($value: true){
   @if $value {
     $prefixes: ("webkit", "moz", "o", "ms", "spec");
   } @else {
@@ -24,7 +24,7 @@
   }
 }
 
-@mixin prefix-only($only) {
+@mixin u-prefix-only($only) {
   @if $only == "webkit" {
     $prefixes: ("webkit", "spec");
   } @else if $only == "moz" {

data/saffron/helpers/_transform.scss

@@ -1,9 +1,9 @@
-@mixin transform($property: none) {
-  @if contains($saf-prefixes, "webkit") and contains($saf-prefixes, "ms") {
-    @include prefix(transform, $property, webkit ms spec);
-  } @else if contains($saf-prefixes, "webkit") {
-    @include prefix(transform, $property, webkit spec);
+@mixin u-transform($property: none) {
+  @if u-contains($saf-prefixes, "webkit") and u-contains($saf-prefixes, "ms") {
+    @include u-prefix(transform, $property, webkit ms spec);
+  } @else if u-contains($saf-prefixes, "webkit") {
+    @include u-prefix(transform, $property, webkit spec);
   } @else {
-    @include prefix(transform, $property, spec);
+    @include u-prefix(transform, $property, spec);
   }
 }

data/saffron/helpers/_transition.scss

@@ -1,7 +1,7 @@
-@mixin transition ($properties...) {
-  @if contains($saf-prefixes, "webkit") {
-    @include prefix(transition, $properties, webkit spec);
+@mixin u-transition ($properties...) {
+  @if u-contains($saf-prefixes, "webkit") {
+    @include u-prefix(transition, $properties, webkit spec);
   } @else {
-    @include prefix(transition, $properties, spec);
+    @include u-prefix(transition, $properties, spec);
   }
 }

data/saffron/in-place/_around-the-world.scss

@@ -1,12 +1,12 @@
-@include keyframes(aroundTheWorld) {
+@include u-keyframes(aroundTheWorld) {
   0% {
-    @include transform(rotate(0deg) translate3d($saf-distance-from-origin * -1, $saf-distance-from-origin * -1, 0) rotate(0deg));
+    @include u-transform(rotate(0deg) translate3d($saf-distance-from-origin * -1, $saf-distance-from-origin * -1, 0) rotate(0deg));
   }
   100% {
-    @include transform(rotate(360deg) translate3d($saf-distance-from-origin * -1, $saf-distance-from-origin * -1, 0) rotate(-360deg));
+    @include u-transform(rotate(360deg) translate3d($saf-distance-from-origin * -1, $saf-distance-from-origin * -1, 0) rotate(-360deg));
   }
 }
 
 @mixin aroundTheWorld($duration: 2s, $delay: 0s, $fill-mode: none, $count: infinite, $timing: ease-in-out) {
-  @include animation(aroundTheWorld $count $duration $delay $fill-mode $timing);
+  @include u-animation(aroundTheWorld $count $duration $delay $fill-mode $timing);
 }

data/saffron/in-place/_bounce.scss

@@ -1,24 +1,24 @@
-@include keyframes(bounce) {
+@include u-keyframes(bounce) {
   0%, 85%, 100% {
-    @include transform(translateY(0) scaleY(1) scaleX(1) translateZ(0));
+    @include u-transform(translateY(0) scaleY(1) scaleX(1) translateZ(0));
   }
   25% {
-    @include transform(translateY(-1.35rem) scaleY(1.02) scaleX(0.98));
+    @include u-transform(translateY(-1.35rem) scaleY(1.02) scaleX(0.98));
   }
   35% {
-    @include transform(translateY(0) scaleY(0.98) scaleX(1.02));
+    @include u-transform(translateY(0) scaleY(0.98) scaleX(1.02));
   }
   50% {
-    @include transform(translateY(-1rem) scaleY(1.01) scaleX(0.99));
+    @include u-transform(translateY(-1rem) scaleY(1.01) scaleX(0.99));
   }
   60% {
-    @include transform(translateY(0) scaleY(0.99) scaleX(1.01));
+    @include u-transform(translateY(0) scaleY(0.99) scaleX(1.01));
   }
   75% {
-    @include transform(translateY(-0.05rem));
+    @include u-transform(translateY(-0.05rem));
   }
 }
 
 @mixin bounce($duration: 1s, $delay: 0s, $count: 1, $fill-mode: none) {
-  @include animation(bounce $count $duration $delay $fill-mode);
+  @include u-animation(bounce $count $duration $delay $fill-mode);
 }

data/saffron/in-place/_colors.scss

@@ -1,6 +1,6 @@
 @mixin backgroundColor($from, $to, $selector: ":hover", $duration: 1.5s, $delay: 0s) {
   background-color: $from;
-  @include transition(background-color $duration $delay);
+  @include u-transition(background-color $duration $delay);
   &#{$selector} {
     background-color: $to;
   }
@@ -8,7 +8,7 @@
 
 @mixin borderColor($from, $to, $selector: ":hover", $duration: 1.5s, $delay: 0s) {
   border-color: $from;
-  @include transition(border-color $duration $delay);
+  @include u-transition(border-color $duration $delay);
   &#{$selector} {
     border-color: $to;
   }
@@ -16,7 +16,7 @@
 
 @mixin color($from, $to, $selector: ":hover", $duration: 1.5s, $delay: 0s) {
   color: $from;
-  @include transition(color $duration $delay);
+  @include u-transition(color $duration $delay);
   &#{$selector} {
     color: $to;
   }

data/saffron/in-place/_contract.scss

@@ -1,6 +1,6 @@
 @mixin contract($selector: ":hover", $duration: 0.5s, $delay: 0s, $timing: cubic-bezier(1.000, -0.600, 0.595, 0.835)) {
-  @include transition(all $duration $delay $timing);
+  @include u-transition(all $duration $delay $timing);
   &#{$selector} {
-    @include transform(translateY($saf-enlarge-contract-jump) scale(1 / $saf-enlarge-contract-multiple));
+    @include u-transform(translateY($saf-enlarge-contract-jump) scale(1 / $saf-enlarge-contract-multiple));
   }
 }

data/saffron/in-place/_cube-flip.scss

@@ -1,10 +1,10 @@
 @mixin cubeFlipUp($selector: ".flipUp", $duration: 0.5s, $delay: 0s, $timing: cubic-bezier(0.905, -0.190, 0.480, 0.995)) {
   position: relative;
-  @include prefix(transform-style, preserve-3d, webkit spec);
-  @include transition(all $duration $delay $timing);
+  @include u-prefix(transform-style, preserve-3d, webkit spec);
+  @include u-transition(all $duration $delay $timing);
   &#{$selector} {
-    @include transform(rotateX(-90deg) translateY(100%) translateZ(0));
-    @include prefix(transform-origin, 50% 100%, webkit moz spec);
+    @include u-transform(rotateX(-90deg) translateY(100%) translateZ(0));
+    @include u-prefix(transform-origin, 50% 100%, webkit moz spec);
   }
   &::before,
   &::after {
@@ -16,23 +16,23 @@
   }
   &::before {
     top: 100%;
-    @include transform(rotateX(-90deg));
-    @include prefix(transform-origin, 0 0, webkit moz spec);
+    @include u-transform(rotateX(-90deg));
+    @include u-prefix(transform-origin, 0 0, webkit moz spec);
   }
   &::after {
     top: -100%;
-    @include transform(rotateX(90deg));
-    @include prefix(transform-origin, 0 100%, webkit moz spec);
+    @include u-transform(rotateX(90deg));
+    @include u-prefix(transform-origin, 0 100%, webkit moz spec);
   }
 }
 
 @mixin cubeFlipDown($selector: ".flipDown", $duration: 0.5s, $delay: 0s, $timing: cubic-bezier(0.905, -0.190, 0.480, 0.995)) {
   position: relative;
-  @include prefix(transform-style, preserve-3d, webkit spec);
-  @include transition(all $duration $delay $timing);
+  @include u-prefix(transform-style, preserve-3d, webkit spec);
+  @include u-transition(all $duration $delay $timing);
   &#{$selector} {
-    @include transform(rotateX(90deg) translateY(-100%) translateZ(0));
-    @include prefix(transform-origin, 50% 0, webkit moz spec);
+    @include u-transform(rotateX(90deg) translateY(-100%) translateZ(0));
+    @include u-prefix(transform-origin, 50% 0, webkit moz spec);
   }
   &::before,
   &::after {
@@ -44,12 +44,12 @@
   }
   &::before {
     top: 100%;
-    @include transform(rotateX(-90deg));
-    @include prefix(transform-origin, 0 0, webkit moz spec);
+    @include u-transform(rotateX(-90deg));
+    @include u-prefix(transform-origin, 0 0, webkit moz spec);
   }
   &::after {
     top: -100%;
-    @include transform(rotateX(90deg));
-    @include prefix(transform-origin, 0 100%, webkit moz spec);
+    @include u-transform(rotateX(90deg));
+    @include u-prefix(transform-origin, 0 100%, webkit moz spec);
   }
 }