title: How to make Sass mixin that extends parent?
body: <p>You could hard-code extending a selector in Sass like:</p>
  
  <pre><code>.box {
      width: 100px;
      height: 100px;
      color: red;
  }
  
  .box-green {
      @extend .box;
      color: green;
  }
  </code></pre>
  
  <p>And then <code>.box-green</code> has all the properties of <code>.box</code>, with its own additional ones. What I want to do is write a generic mixin that does that - takes a class, adds all its properties with its own and adds a modifier to the class name. If something like this pseudo-code worked (which it doesn't), it would be ideal.</p>
  
  <pre><code>.box {
      width: 100px;
      height: 100px;
      color: red;
  
      @include make-modifier(&amp;, green) {
          color: green;
      }
  }
  
  @mixin make-modifier(parent, modifier-name) {
     .#{$parent}-#{$modifier-name} {
          @content;
     }
  }
  </code></pre>
  
  <p>Is there a way to do it? Even if only in the latest version it's fine.</p>