Couldn't get Angular animations working. Why? Because I hadn't defined 'ngAnimate' in my app module.
I wanted the receipt to animate in, a simple slide-down-and-in type thing. Most of the angular tutorials look god awful, so this is how you want to do it ifyou're not writing plain CSS:
.receipt {
// Animations
&.ng-hide-remove {
@include animation(fade-in-and-down .35s ease-in);
// @include animation-fill-mode(forwards);
}
}
}
Angular works by applying .ng-hide-remove, or .ng-hide-add for when you're toggling a box. (Seems like a roundabout naming schema, but whatever).
Unfortunately applying Bourbon's @include animation-fill-mode(forwards) didn't work in the way I was expecting it to. However, applying a transform: translateY(10px); in the base class did. Meh.