Unified formatting across files

indent_style = space
indent_size = 2
insert_final_newline = true
each line within { } to specify single rule

.gitignore

@@ -1,3 +1,3 @@
 .sass-cache
 node_modules/
-.DS_Store
+.DS_Store

animate-config.json

@@ -95,4 +95,4 @@
     "rollOut": true
   }
 
-}
+}

source/_base.css

@@ -19,4 +19,4 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
 
 .animated.hinge {
 	animation-duration: 2s;
-}
+}

source/attention_seekers/bounce.css

@@ -1,9 +1,17 @@
 @keyframes bounce {
-	0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
+	0%, 20%, 50%, 80%, 100% {
-	40% {transform: translateY(-30px);}
+    transform: translateY(0);
-	60% {transform: translateY(-15px);}
+  }
+
+	40% {
+    transform: translateY(-30px);
+  }
+
+	60% {
+    transform: translateY(-15px);
+  }
 }
 
 .bounce {
 	animation-name: bounce;
-}
+}

source/attention_seekers/flash.css

@@ -1,8 +1,13 @@
 @keyframes flash {
-	0%, 50%, 100% {opacity: 1;}
+	0%, 50%, 100% {
-	25%, 75% {opacity: 0;}
+    opacity: 1;
+  }
+
+	25%, 75% {
+    opacity: 0;
+  }
 }
 
 .flash {
 	animation-name: flash;
-}
+}

source/attention_seekers/pulse.css

@@ -1,11 +1,19 @@
 /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
 
 @keyframes pulse {
-    0% { transform: scale(1); }
+  0% {
-	50% { transform: scale(1.1); }
+    transform: scale(1);
-    100% { transform: scale(1); }
+  }
+
+	50% {
+    transform: scale(1.1);
+  }
+
+  100% {
+    transform: scale(1);
+  }
 }
 
 .pulse {
 	animation-name: pulse;
-}
+}

source/attention_seekers/rubberBand.css

@@ -1,9 +1,23 @@
 @keyframes rubberBand {
-	0% { transform: scale(1); }
+	0% {
-	30% { transform: scaleX(1.25) scaleY(0.75); }
+    transform: scale(1);
-	40% { transform: scaleX(0.75) scaleY(1.25); }
+  }
-	60% { transform: scaleX(1.15) scaleY(0.85); }
+
-	100% { transform: scale(1); }
+	30% {
+    transform: scaleX(1.25) scaleY(0.75);
+  }
+
+	40% {
+    transform: scaleX(0.75) scaleY(1.25);
+  }
+
+	60% {
+    transform: scaleX(1.15) scaleY(0.85);
+  }
+
+	100% {
+    transform: scale(1);
+  }
 }
 
 .rubberBand {

source/attention_seekers/shake.css

@@ -1,9 +1,17 @@
 @keyframes shake {
-	0%, 100% {transform: translateX(0);}
+	0%, 100% {
-	10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}
+    transform: translateX(0);
-	20%, 40%, 60%, 80% {transform: translateX(10px);}
+  }
+
+	10%, 30%, 50%, 70%, 90% {
+    transform: translateX(-10px);
+  }
+
+	20%, 40%, 60%, 80% {
+    transform: translateX(10px);
+  }
 }
 
 .shake {
 	animation-name: shake;
-}
+}

source/attention_seekers/swing.css

@@ -1,12 +1,26 @@
 @keyframes swing {
-	20% { transform: rotate(15deg); }
+	20% {
-	40% { transform: rotate(-10deg); }
+    transform: rotate(15deg);
-	60% { transform: rotate(5deg); }
+  }
-	80% { transform: rotate(-5deg); }
+
-	100% { transform: rotate(0deg); }
+	40% {
+    transform: rotate(-10deg);
+  }
+
+	60% {
+    transform: rotate(5deg);
+  }
+
+	80% { t
+    ransform: rotate(-5deg);
+  }
+
+	100% {
+    transform: rotate(0deg);
+  }
 }
 
 .swing {
 	transform-origin: top center;
 	animation-name: swing;
-}
+}

source/attention_seekers/tada.css

@@ -1,11 +1,25 @@
 @keyframes tada {
-	0% {transform: scale(1);}
+	0% {
-	10%, 20% {transform: scale(0.9) rotate(-3deg);}
+    transform: scale(1);
-	30%, 50%, 70%, 90% {transform: scale(1.1) rotate(3deg);}
+  }
-	40%, 60%, 80% {transform: scale(1.1) rotate(-3deg);}
+
-	100% {transform: scale(1) rotate(0);}
+	10%, 20% {
+    transform: scale(0.9) rotate(-3deg);
+  }
+
+	30%, 50%, 70%, 90% {
+    transform: scale(1.1) rotate(3deg);
+  }
+
+	40%, 60%, 80% {
+    transform: scale(1.1) rotate(-3deg);
+  }
+
+  100% {
+    transform: scale(1) rotate(0);
+  }
 }
 
 .tada {
 	animation-name: tada;
-}
+}

source/attention_seekers/wobble.css

@@ -1,15 +1,35 @@
 /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
 
 @keyframes wobble {
-  0% { transform: translateX(0%); }
+  0% {
-  15% { transform: translateX(-25%) rotate(-5deg); }
+    transform: translateX(0%);
-  30% { transform: translateX(20%) rotate(3deg); }
+  }
-  45% { transform: translateX(-15%) rotate(-3deg); }
+
-  60% { transform: translateX(10%) rotate(2deg); }
+  15% {
-  75% { transform: translateX(-5%) rotate(-1deg); }
+    transform: translateX(-25%) rotate(-5deg);
-  100% { transform: translateX(0%); }
+  }
+
+  30% {
+    transform: translateX(20%) rotate(3deg);
+  }
+
+  45% {
+    transform: translateX(-15%) rotate(-3deg);
+  }
+
+  60% {
+    transform: translateX(10%) rotate(2deg);
+  }
+
+  75% {
+    transform: translateX(-5%) rotate(-1deg);
+  }
+
+  100% {
+    transform: translateX(0%);
+  }
 }
 
 .wobble {
 	animation-name: wobble;
-}
+}

source/bouncing_entrances/bounceInDown.css

@@ -20,4 +20,4 @@
 
 .bounceInDown {
 	animation-name: bounceInDown;
-}
+}

source/bouncing_entrances/bounceInLeft.css

@@ -20,4 +20,4 @@
 
 .bounceInLeft {
 	animation-name: bounceInLeft;
-}
+}

source/bouncing_entrances/bounceInRight.css

@@ -20,4 +20,4 @@
 
 .bounceInRight {
 	animation-name: bounceInRight;
-}
+}

source/bouncing_entrances/bounceInUp.css

@@ -20,4 +20,4 @@
 
 .bounceInUp {
 	animation-name: bounceInUp;
-}
+}

source/bouncing_exits/bounceOut.css

@@ -20,4 +20,4 @@
 
 .bounceOut {
 	animation-name: bounceOut;
-}
+}

source/bouncing_exits/bounceOutDown.css

@@ -16,4 +16,4 @@
 
 .bounceOutDown {
 	animation-name: bounceOutDown;
-}
+}

source/bouncing_exits/bounceOutLeft.css

@@ -16,4 +16,4 @@
 
 .bounceOutLeft {
 	animation-name: bounceOutLeft;
-}
+}

source/bouncing_exits/bounceOutRight.css

@@ -16,4 +16,4 @@
 
 .bounceOutRight {
 	animation-name: bounceOutRight;
-}
+}

source/bouncing_exits/bounceOutUp.css

@@ -16,4 +16,4 @@
 
 .bounceOutUp {
 	animation-name: bounceOutUp;
-}
+}

source/fading_entrances/fadeIn.css

@@ -5,4 +5,4 @@
 
 .fadeIn {
 	animation-name: fadeIn;
-}
+}

source/fading_entrances/fadeInDown.css

@@ -12,4 +12,4 @@
 
 .fadeInDown {
 	animation-name: fadeInDown;
-}
+}

source/fading_entrances/fadeInDownBig.css

@@ -12,4 +12,4 @@
 
 .fadeInDownBig {
 	animation-name: fadeInDownBig;
-}
+}

source/fading_entrances/fadeInLeft.css

@@ -12,4 +12,4 @@
 
 .fadeInLeft {
 	animation-name: fadeInLeft;
-}
+}

source/fading_entrances/fadeInLeftBig.css

@@ -12,4 +12,4 @@
 
 .fadeInLeftBig {
 	animation-name: fadeInLeftBig;
-}
+}

source/fading_entrances/fadeInRight.css

@@ -12,4 +12,4 @@
 
 .fadeInRight {
 	animation-name: fadeInRight;
-}
+}

source/fading_entrances/fadeInRightBig.css

@@ -12,4 +12,4 @@
 
 .fadeInRightBig {
 	animation-name: fadeInRightBig;
-}
+}

source/fading_entrances/fadeInUp.css

@@ -12,4 +12,4 @@
 
 .fadeInUp {
 	animation-name: fadeInUp;
-}
+}

source/fading_entrances/fadeInUpBig.css

@@ -12,4 +12,4 @@
 
 .fadeInUpBig {
 	animation-name: fadeInUpBig;
-}
+}

source/fading_exits/fadeOut.css

@@ -5,4 +5,4 @@
 
 .fadeOut {
 	animation-name: fadeOut;
-}
+}

source/fading_exits/fadeOutDown.css

@@ -12,4 +12,4 @@
 
 .fadeOutDown {
 	animation-name: fadeOutDown;
-}
+}

source/fading_exits/fadeOutDownBig.css

@@ -12,4 +12,4 @@
 
 .fadeOutDownBig {
 	animation-name: fadeOutDownBig;
-}
+}

source/fading_exits/fadeOutLeft.css

@@ -12,4 +12,4 @@
 
 .fadeOutLeft {
 	animation-name: fadeOutLeft;
-}
+}

source/fading_exits/fadeOutLeftBig.css

@@ -12,4 +12,4 @@
 
 .fadeOutLeftBig {
 	animation-name: fadeOutLeftBig;
-}
+}

source/fading_exits/fadeOutRight.css

@@ -12,4 +12,4 @@
 
 .fadeOutRight {
 	animation-name: fadeOutRight;
-}
+}

source/fading_exits/fadeOutRightBig.css

@@ -12,4 +12,4 @@
 
 .fadeOutRightBig {
 	animation-name: fadeOutRightBig;
-}
+}

source/fading_exits/fadeOutUp.css

@@ -12,4 +12,4 @@
 
 .fadeOutUp {
 	animation-name: fadeOutUp;
-}
+}

source/fading_exits/fadeOutUpBig.css

@@ -12,4 +12,4 @@
 
 .fadeOutUpBig {
 	animation-name: fadeOutUpBig;
-}
+}

source/flippers/flip.css

@@ -3,18 +3,22 @@
 		transform: perspective(400px) translateZ(0) rotateY(0) scale(1);
 		animation-timing-function: ease-out;
 	}
+
 	40% {
 		transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);
 		animation-timing-function: ease-out;
 	}
+
 	50% {
 		transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
 		animation-timing-function: ease-in;
 	}
+
 	80% {
 		transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);
 		animation-timing-function: ease-in;
 	}
+
 	100% {
 		transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);
 		animation-timing-function: ease-in;

source/flippers/flipInX.css

@@ -1,24 +1,24 @@
 @keyframes flipInX {
-    0% {
+  0% {
-        transform: perspective(400px) rotateX(90deg);
+    transform: perspective(400px) rotateX(90deg);
-        opacity: 0;
+    opacity: 0;
-    }
+  }
 
-    40% {
+  40% {
-        transform: perspective(400px) rotateX(-10deg);
+    transform: perspective(400px) rotateX(-10deg);
-    }
+  }
 
-    70% {
+  70% {
-        transform: perspective(400px) rotateX(10deg);
+    transform: perspective(400px) rotateX(10deg);
-    }
+  }
 
-    100% {
+  100% {
-        transform: perspective(400px) rotateX(0deg);
+    transform: perspective(400px) rotateX(0deg);
-        opacity: 1;
+    opacity: 1;
-    }
+  }
 }
 
 .flipInX {
 	backface-visibility: visible !important;
 	animation-name: flipInX;
-}
+}

source/flippers/flipInY.css

@@ -1,24 +1,24 @@
 @keyframes flipInY {
-    0% {
+  0% {
-        transform: perspective(400px) rotateY(90deg);
+    transform: perspective(400px) rotateY(90deg);
-        opacity: 0;
+    opacity: 0;
-    }
+  }
 
-    40% {
+  40% {
-        transform: perspective(400px) rotateY(-10deg);
+    transform: perspective(400px) rotateY(-10deg);
-    }
+  }
 
-    70% {
+  70% {
-        transform: perspective(400px) rotateY(10deg);
+    transform: perspective(400px) rotateY(10deg);
-    }
+  }
 
-    100% {
+  100% {
-        transform: perspective(400px) rotateY(0deg);
+    transform: perspective(400px) rotateY(0deg);
-        opacity: 1;
+    opacity: 1;
-    }
+  }
 }
 
 .flipInY {
 	backface-visibility: visible !important;
 	animation-name: flipInY;
-}
+}

source/flippers/flipOutX.css

@@ -1,15 +1,16 @@
 @keyframes flipOutX {
-    0% {
+  0% {
-        transform: perspective(400px) rotateX(0deg);
+    transform: perspective(400px) rotateX(0deg);
-        opacity: 1;
+    opacity: 1;
-    }
+  }
-	100% {
+
-        transform: perspective(400px) rotateX(90deg);
+  100% {
-        opacity: 0;
+    transform: perspective(400px) rotateX(90deg);
-    }
+    opacity: 0;
+  }
 }
 
 .flipOutX {
 	animation-name: flipOutX;
 	backface-visibility: visible !important;
-}
+}

source/flippers/flipOutY.css

@@ -1,15 +1,16 @@
 @keyframes flipOutY {
-    0% {
+  0% {
-        transform: perspective(400px) rotateY(0deg);
+    transform: perspective(400px) rotateY(0deg);
-        opacity: 1;
+    opacity: 1;
-    }
+  }
-	100% {
+
-        transform: perspective(400px) rotateY(90deg);
+  100% {
-        opacity: 0;
+    transform: perspective(400px) rotateY(90deg);
-    }
+    opacity: 0;
+  }
 }
 
 .flipOutY {
 	backface-visibility: visible !important;
 	animation-name: flipOutY;
-}
+}

source/lightspeed/lightSpeedIn.css

@@ -1,11 +1,22 @@
 @keyframes lightSpeedIn {
-	0% { transform: translateX(100%) skewX(-30deg); opacity: 0; }
+	0% {
-	60% { transform: translateX(-20%) skewX(30deg); opacity: 1; }
+    transform: translateX(100%) skewX(-30deg); opacity: 0;
-	80% { transform: translateX(0%) skewX(-15deg); opacity: 1; }
+  }
-	100% { transform: translateX(0%) skewX(0deg); opacity: 1; }
+
+	60% {
+    transform: translateX(-20%) skewX(30deg); opacity: 1;
+  }
+
+	80% {
+    transform: translateX(0%) skewX(-15deg); opacity: 1;
+  }
+
+	100% {
+    transform: translateX(0%) skewX(0deg); opacity: 1;
+  }
 }
 
 .lightSpeedIn {
-    animation-name: lightSpeedIn;
+  animation-name: lightSpeedIn;
-    animation-timing-function: ease-out;
+  animation-timing-function: ease-out;
-}
+}

source/lightspeed/lightSpeedOut.css

@@ -1,10 +1,14 @@
 @keyframes lightSpeedOut {
-	0% { transform: translateX(0%) skewX(0deg); opacity: 1; }
+	0% {
-	100% { transform: translateX(100%) skewX(-30deg); opacity: 0; }
+    transform: translateX(0%) skewX(0deg); opacity: 1;
+  }
+
+	100% {
+    transform: translateX(100%) skewX(-30deg); opacity: 0;
+  }
 }
 
 .lightSpeedOut {
-    animation-name: lightSpeedOut;
+  animation-name: lightSpeedOut;
-
+  animation-timing-function: ease-in;
-    animation-timing-function: ease-in;
+}
-}

source/rotating_entrances/rotateIn.css

@@ -14,4 +14,4 @@
 
 .rotateIn {
 	animation-name: rotateIn;
-}
+}

source/rotating_entrances/rotateInDownLeft.css

@@ -14,4 +14,4 @@
 
 .rotateInDownLeft {
 	animation-name: rotateInDownLeft;
-}
+}

source/rotating_entrances/rotateInDownRight.css

@@ -14,4 +14,4 @@
 
 .rotateInDownRight {
 	animation-name: rotateInDownRight;
-}
+}

source/rotating_entrances/rotateInUpLeft.css

@@ -14,4 +14,4 @@
 
 .rotateInUpLeft {
 	animation-name: rotateInUpLeft;
-}
+}

source/rotating_entrances/rotateInUpRight.css

@@ -14,4 +14,4 @@
 
 .rotateInUpRight {
 	animation-name: rotateInUpRight;
-}
+}

source/rotating_exits/rotateOut.css

@@ -14,4 +14,4 @@
 
 .rotateOut {
 	animation-name: rotateOut;
-}
+}

source/rotating_exits/rotateOutDownLeft.css

@@ -14,4 +14,4 @@
 
 .rotateOutDownLeft {
 	animation-name: rotateOutDownLeft;
-}
+}

source/rotating_exits/rotateOutDownRight.css

@@ -14,4 +14,4 @@
 
 .rotateOutDownRight {
 	animation-name: rotateOutDownRight;
-}
+}

source/rotating_exits/rotateOutUpRight.css

@@ -14,4 +14,4 @@
 
 .rotateOutUpRight {
 	animation-name: rotateOutUpRight;
-}
+}

source/sliders/slideInDown.css

@@ -11,4 +11,4 @@
 
 .slideInDown {
 	animation-name: slideInDown;
-}
+}

source/sliders/slideInLeft.css

@@ -11,4 +11,4 @@
 
 .slideInLeft {
 	animation-name: slideInLeft;
-}
+}

source/sliders/slideInRight.css

@@ -11,4 +11,4 @@
 
 .slideInRight {
 	animation-name: slideInRight;
-}
+}

source/sliders/slideOutLeft.css

@@ -11,4 +11,4 @@
 
 .slideOutLeft {
 	animation-name: slideOutLeft;
-}
+}

source/sliders/slideOutRight.css

@@ -11,4 +11,4 @@
 
 .slideOutRight {
 	animation-name: slideOutRight;
-}
+}

source/sliders/slideOutUp.css

@@ -11,4 +11,4 @@
 
 .slideOutUp {
 	animation-name: slideOutUp;
-}
+}

source/specials/hinge.css

@@ -1,11 +1,35 @@
 @keyframes hinge {
-	0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; }
+	0% {
-	20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; }
+    transform: rotate(0);
-	40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; }
+    transform-origin: top left;
-	80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; }
+    animation-timing-function: ease-in-out;
-	100% { transform: translateY(700px); opacity: 0; }
+  }
+
+	20%, 60% {
+    transform: rotate(80deg);
+    transform-origin: top left;
+    animation-timing-function: ease-in-out;
+  }
+
+	40% {
+    transform: rotate(60deg);
+    transform-origin: top left;
+    animation-timing-function: ease-in-out;
+  }
+
+	80% {
+    transform: rotate(60deg) translateY(0);
+    transform-origin: top left;
+    animation-timing-function: ease-in-out;
+    opacity: 1;
+  }
+
+	100% {
+    transform: translateY(700px);
+    opacity: 0;
+  }
 }
 
 .hinge {
 	animation-name: hinge;
-}
+}

source/specials/rollIn.css

@@ -1,10 +1,17 @@
 /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
 
 @keyframes rollIn {
-	0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); }
+	0% {
-	100% { opacity: 1; transform: translateX(0px) rotate(0deg); }
+    opacity: 0;
+    transform: translateX(-100%) rotate(-120deg);
+  }
+
+	100% {
+    opacity: 1;
+    transform: translateX(0px) rotate(0deg);
+  }
 }
 
 .rollIn {
 	animation-name: rollIn;
-}
+}

source/specials/rollOut.css

@@ -1,12 +1,12 @@
 /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
 
 @keyframes rollOut {
-    0% {
+  0% {
 		opacity: 1;
 		transform: translateX(0px) rotate(0deg);
 	}
 
-    100% {
+  100% {
 		opacity: 0;
 		transform: translateX(100%) rotate(120deg);
 	}
@@ -14,4 +14,4 @@
 
 .rollOut {
 	animation-name: rollOut;
-}
+}