Mixins

kf-lead ($lead-time, $animation-map)

Adds lead time at the begining of the provided animation map. The lead time should be specified as a standard CSS timing value, for example 2s or 1000ms are both valid lead times.

.kf-lead-example {
  @include kf-lead(2000ms, (
    'div': (margin-left: (0ms: 0%, 2s: 100%))
  ));
}

.kf-lead-example {
  max-width: 600px;
  width: 100%;
  div {
    height: 20px;
    width: 20px;
    background: white;
    border: 1px solid black;
  }
}

<div class='kf-lead-example'>
  <div></div>
</div>

Edit

kf-lag

kf-loop