Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (vundefined)
// Compass (vundefined)
// dart-sass (v1.2.1)
// ----



@mixin a-mixin() {
  content: "mixin root";
  &.mixin-ampersand {
    content: "this is an ampersanded subselector of the mixin";
  }
}
%an-extendable {
  content: "extendable root";
  &.extendable-ampersand {
    content: "this is an ampersanded subselector of the extendable";
  }
}
.an-extender-of-an-extendable {
  @extend %an-extendable;
}

.a-user-of-a-mixin { @include a-mixin(); }

.a-class {
  content: "this is the root of .a-class";
  &.a-class-ampersand {
    content: "this is an ampersanded subselector of .a-class";
  }
}

.an-extender-of-a-class {
  @extend .a-class;
}

SassMeister-output.css

.an-extender-of-an-extendable {
  content: "extendable root";
}
.extendable-ampersand.an-extender-of-an-extendable {
  content: "this is an ampersanded subselector of the extendable";
}

.a-user-of-a-mixin {
  content: "mixin root";
}
.a-user-of-a-mixin.mixin-ampersand {
  content: "this is an ampersanded subselector of the mixin";
}

.a-class, .an-extender-of-a-class {
  content: "this is the root of .a-class";
}
.a-class.a-class-ampersand, .a-class-ampersand.an-extender-of-a-class {
  content: "this is an ampersanded subselector of .a-class";
}