add transition-delay to animation mixin

[chucklorenz]

I'm proposing that we add a new parameter to the .on-screen-anim() mixin: transition-delay. It would provide more control over when animations begin and so enhance their effectiveness.

@guywillis Before I submit the PR, what do you prefer as a default delay 1s? 0? something else?

Expect the PR to look like this:

.on-screen-anim(fade-in-top; 0; 1; 1s; translateY(-100px); translateY(0));
.on-screen-anim(fade-in-bottom; 0; 1; 1s; translateY(100px); translateY(0));
.on-screen-anim(fade-in-left; 0; 1; 1s; translateX(-100px); translateX(0));
.on-screen-anim(fade-in-right; 0; 1; 1s; translateX(100px); translateX(0));

.on-screen-anim(@selector; @opacity-before; @opacity-after; @transition-delay; @transform-before; @transform-after) {
  .@{selector}-before > div {
    opacity: @opacity-before;
    transform: @transform-before;
    transition: all @animation-duration @animation-easing, visibility 0s linear 0s;
    transition-delay: @transition-delay;
  }

  .@{selector}-after > div {
    opacity: @opacity-after;
    transform: @transform-after;
  }
}