SASS Striped CSS3 background mixin

stripes.scss

@mixin striped-background($stripe1, $stripe2, $angle: -45deg, $size: 40px, $other-backgrounds: false) {
	@include background-image(linear-gradient($angle, $stripe1 25%, $stripe2 25%, $stripe2 50%, $stripe1 50%, $stripe1 75%, $stripe2 75%, $stripe2), $other-backgrounds);
	background-repeat: repeat;
	@include background-size(unquote("#{$size} #{$size}"));
}


// from twitter bootstrap
@-webkit-keyframes progress-bar-stripes {
  from { background-position: 0 0; }
  to { background-position: 40px 0; }
}

@-moz-keyframes progress-bar-stripes {
  from { background-position: 0 0; }
  to { background-position: 40px 0; }
}

@keyframes progress-bar-stripes {
  from { background-position: 0 0; }
  to { background-position: 40px 0; }
}


.button {
   @include striped-background(rgba(255,255,255,0.6), transparent, $other-backgrounds: $button-gradient);
   @include _("animation", "progress-bar-stripes 2s linear infinite");
}