Generate a solid class (for use in markup) and a silent class (for use with @extend) in one go.

Class-mixin.scss

/**
 * Generate a solid class (for use in markup) and a silent class (for use with
 * `@extend`) in one go.
 * 
 * Created by csswizardry at http://jsfiddle.net/csswizardry/ECntr/
 */
@mixin class($name) {
    .#{$name},
    %#{$name} {
        @content
    }
}
/**
 * Example usage:
 */

@include class(foo) {
    color: red;

    &:hover {
        color: black;
    }

}

@include class(foo--bar) {
    font-weight: bold;
}

.bar {
    @extend %foo;
    @extend %foo--bar;
}