/// Creates a fading animation. /// @param {Number} $from [0] - Opacity to start at. /// @param {Number} $to [1] - Opacity to end at. /// @return {Map} A keyframes map that can be used with the ‘generate-keyframes()` mixin. @function fade(

$from: 0,
$to: 1

) {

$type: type-of($from);
$keyframes: ();

@if $type == 'string' {
  @if $from == in {
    $from: 0;
    $to: 1;
  } @else if $from == out {
    $from: 1;
    $to: 0;
  }
}

$fromName: $from * 100;
$toName:   $to   * 100;

$keyframes: (
  name: 'fade-#{$fromName}-to-#{$toName}',
  0: (opacity: $from),
  100: (opacity: $to),
);

@return $keyframes;

}