BEM shortcuts for SASS >= 3.3.0

bem.scss

// elements get appended with "__" and the $name
@mixin e($name) {
  @at-root #{&}__#{$name} {
    @content;
  }
}

// modifiers get appended with "--" and the $name
@mixin m($name) {
  @at-root #{&}--#{$name} {
    @content;
  }
}

// shortcut for @extend %name
@mixin x($name) {
  @extend %#{$name} !optional;
}