SCSS Increase specificity mixin

increase-specificity.scss

@mixin increase-specificity($times: 1) {
  $selector: "";

  @for $index from 1 through $times {
    $selector: #{$selector}#{&};
  }

  &#{$selector} {
    @content;
  }
}

// Tests
.default {
  @include increase-specificity() {
    padding: 2;
  }
}
.once {
  @include increase-specificity(1) {
    padding: 2;
  }
}
.twice {
  @include increase-specificity(2) {
    padding: 2;
  }
}
.thrice {
  @include increase-specificity(3) {
    padding: 2;
  }
}

// Output
.default.default {
  padding: 2;
}

.once.once {
  padding: 2;
}

.twice.twice.twice {
  padding: 2;
}

.thrice.thrice.thrice.thrice {
  padding: 2;
}