title: Handling optional arguments in a Sass mixin
body: <p>I'm just getting started with Sass so bear with me.</p>
  
  <p>I have this mixin to handle declaring font sizes in both <code>px</code> (for old IE) and <code>rem</code> for modern browsers, it also does a nice <code>line-height</code> calculation.</p>
  
  <pre><code>@mixin font-size($font-size, $line-height-val: "", $sledge-hammer: "" /* $sledge-hammer is    for an optional `!important` keyword */) {
      font-size: ($font-size)+px#{$sledge-hammer};
      font-size: ($font-size / $base-font-size)+rem#{$sledge-hammer};
      @if $line-height-val == "" {
            line-height: ceil($font-size / $base-line-height) * ($base-line-height / $font-size);
      } @else {
            line-height: #{$line-height-val};
      }
  }
  </code></pre>
  
  <p>It works but I feel like the optional arguments (<code>$line-height-val</code> and <code>$sledge-hammer</code>) is not the most optimal way of doing it. <code>$line-height-val</code> is needed as sometimes I need to manually declare the <code>line-height</code> and <code>$sledge-hammer</code> is needed because I need to declare the <code>!important</code> keyword on some of my helper classes.</p>
  
  <p>90% of the time I just use the mixin like this:</p>
  
  <p><code>@include font-size(24);</code></p>
  
  <p>Which compiles too:</p>
  
  <pre><code>font-size: 24px;
  font-size: 1.5rem;
  line-height: 1.1;
  </code></pre>
  
  <p>When I need to override the <code>line-height</code> I do this:</p>
  
  <p><code>@include font-size(24, 1.6);</code></p>
  
  <p>Which compiles too:</p>
  
  <pre><code>font-size: 24px;
  font-size: 1.5rem;
  line-height: 1.6;
  </code></pre>
  
  <p>But if I need to declare the <code>!important</code> keyword then I have to do this:</p>
  
  <p><code>@include font-size($font-size-sml, "", !important);</code></p>
  
  <p>Which compiles too:</p>
  
  <pre><code>font-size: 15px!important;
  font-size: 0.9375rem!important;
  line-height: 1.6;
  </code></pre>
  
  <p>But feels funny I have to use empty <code>""</code> for the 2nd argument, and the value for the 3rd argument will always be <code>!important</code> so that should be in the mixin?</p>
  
  <p>I just wonder if there's a much cleaner way of writing this mixin?</p>