title: SASS mixin with variable as selector
body: <p>My goal is to style a bunch of input types which requires a lot of code. Most of it is re-used when you are also declaring the various states inputs have. </p>
  
  <p><strong>Is there a method with SASS where you can pass a "state" variable to a mixin, and then use that mixin as a selector?</strong></p>
  
  <p>Here's my (non-working) code that I was plugging in at <a href="https://www.sassmeister.com" rel="nofollow noreferrer">https://www.sassmeister.com</a> to test.</p>
  
  <pre><code>@mixin inputs($state) {
    input[type="text"]$state;
    input[type="email"]$state;
    input[type="url"]$state;
    input[type="search"]$state;
    input[type="date"]$state;
    input[type="time"]$state;
    /* etc */
  }
  
  @include inputs() {
    border:2px solid #ccc;
  }
  
  @include inputs(:hover) {
     border:2px solid #000;
  }
  
  @include inputs(:focus) {
     border:2px solid blue;
  }
  
  @include inputs(:active) {
     border:2px solid red
  }
  </code></pre>