@import "../settings/variables";
@import "../tools/mixins/animation";
@import "../settings/keyframes";

@for $i from 0 through $max-data-points {
  .u-animate-bar-#{$i} {
    @include animate(grow-y, $i/5);
  }
}

@for $i from 0 through $max-data-points {
  .u-animate-line-#{$i} {
    @include animate(draw-stroke, 0, ($i/5 * $animation-duration) + $animation-duration, linear, reverse);
  }
}

.u-animation {
  &--fill-backwards {
    animation-fill-mode: backwards;
  }
}

.u-animate-fade-in {
  @include animate(fade-in, 0, 1.25*$animation-duration, ease-in);

  &--long {
    @include animate(slow-fade-in, 0, 2*$animation-duration, ease-in);
  }

  &--fast {
    @include animate(fade-in, 0, $transition-time, ease-out);
  }
}