Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.3.10)
// Compass (v1.0.0.alpha.20)
// ----

// OPTIONS

// background: <color>
// color: <color>
// icon: "\f122" unicode value
// style: social, bfb (big fuckin button)
// blink: fuck-yeah, pulse

$buttons:(
  default:(),
  download:(
    background: #1dbd3d,
    color: white,
    icon: '\f440', // download icon
    
    test:(
      color: red,
      background: blue
    )
  ),
  twitter:(
    background: #55acee,
    color: white,
    icon: '\f202', // twitter-icon
    style: social
  ),
  fuck-yeah:(
    background: #ff0085,
    color: white,
    blink: pulse,
    style: bfb
  )
);

// Base button styles via an extend
%button {
  display: inline-block;
  margin: 0;
  padding: .4em .9em;
  border-width: 1px 1px 2px;
  border-style: solid;
  border-radius: em(3);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  appearance: none;
  box-shadow: 0 -1px 0 rgba(255,255,255,0.15) inset;
  
  &:active {
		border-width: 2px 1px 1px
	}
}
 
// The Mixin
@mixin button($map...) {
  @extend %button;
  
  @each $type in $map {
    // Defaults
  }
}

@mixin magic-map($map){
  @each $key, $property in $map {
    @if length($property) > 1 {
      .#{$key} {
        @include magic-map(map-get($map,$key));
      }
    } @elseif length($property) == 1 {
      #{$key}: $property;
    }
  }
}

.button {
  @include magic-map($buttons){
    
  }
}

SassMeister-output.css

.button .download {
  background: #1dbd3d;
  color: white;
  icon: "\f440";
}
.button .download .test {
  color: red;
  background: blue;
}
.button .twitter {
  background: #55acee;
  color: white;
  icon: "\f202";
  style: social;
}
.button .fuck-yeah {
  background: #ff0085;
  color: white;
  blink: pulse;
  style: bfb;
}