Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----

/**
 * Generate a solid class (for use in markup) and a silent class (for use with
 * `@extend`) in one go.
 */
@mixin class($name) {
    .#{$name},
    %#{$name} {
        @content
    }
}





@include class(foo) {
    color: red;

    &:hover {
        color: black;
    }

}

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

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

SassMeister-output.css

/**
 * Generate a solid class (for use in markup) and a silent class (for use with
 * `@extend`) in one go.
 */
.foo,
.bar {
  color: red;
}
.foo:hover,
.bar:hover {
  color: black;
}

.foo--bar,
.bar {
  font-weight: bold;
}