//************************************************************************// // Background property for adding multiple backgrounds using shorthand // notation. //************************************************************************//

@mixin background($backgrounds…) {

$webkit-backgrounds: ();
$spec-backgrounds: ();

@each $background in $backgrounds {
  $webkit-background: ();
  $spec-background: ();
  $background-type: type-of($background);

  @if $background-type == string or $background-type == list {
    $background-str: if($background-type == list, nth($background, 1), $background);

    $url-str:       str-slice($background-str, 1, 3);
    $gradient-type: str-slice($background-str, 1, 6);

    @if $url-str == "url" {
      $webkit-background: $background;
      $spec-background:   $background;
    }

    @else if $gradient-type == "linear" {
      $gradients: _linear-gradient-parser("#{$background}");
      $webkit-background: map-get($gradients, webkit-image);
      $spec-background:   map-get($gradients, spec-image);
    }

    @else if $gradient-type == "radial" {
      $gradients: _radial-gradient-parser("#{$background}");
      $webkit-background: map-get($gradients, webkit-image);
      $spec-background:   map-get($gradients, spec-image);
    }

    @else {
      $webkit-background: $background;
      $spec-background:   $background;
    }
  }

  @else {
    $webkit-background: $background;
    $spec-background:   $background;
  }

  $webkit-backgrounds: append($webkit-backgrounds, $webkit-background, comma);
  $spec-backgrounds:   append($spec-backgrounds,   $spec-background,   comma);
}

background: $webkit-backgrounds;
background: $spec-backgrounds;

}