SASS mixin for a font-awesome before/after usage

Question

In my SASS I use font-awesome declarations all over the place. I'm in love with it. I've created a SASS mixin for the usage:

I started with the following:

@mixin font-awesome-icon($type, $unicode, $size, $margin, $color, $weight) {
  @if $type == 'after'{
    &:after {
      content:$unicode;
      font-family:"FontAwesome";
      font-size:$size;
      color:$color;
      font-weight:$weight;
      margin:$margin;
      @content;
    }
  }
  @if $type == 'before' {
    &:before {
      content:$unicode;
      font-family:"FontAwesome";
      font-size:$size;
      color:$color;
      font-weight:$weight;
      margin:$margin;
      @content;
    }
  }
}

I then scaled it down further to the following:

@mixin font-awesome-icon($type, $unicode, $size, $margin, $color, $weight) {
  $beforeOrAfter:'';

  @if $type == 'after' {
    $beforeOrAfter:'after';
  }
  @else if $type == 'before' {
    $beforeOrAfter:'before';
  }

  &:#{$beforeOrAfter} {
      content:$unicode;
      font-family:"FontAwesome";
      font-size:$size;
      color:$color;
      font-weight:$weight;
      margin:$margin;
      @content;
    }
}

The usage would something like:

.tater {
@include font-awesome-icon(before,'\f0de',2.1em,0 0 0 3em,orange,300);
}

But I feel I could make the before/after part cleaner. I basically need to determine if it is a 'before' or 'after'.

Answer 1

The $type can be passed in directly to the pseudo-class selector after you check its validity.

@if $type == 'after' or $type == 'before' {
  &:#{$type} {
    content:$unicode;
    font-family:"FontAwesome";
    font-size:$size;
    color:$color;
    font-weight:$weight;
    margin:$margin;
    @content;
  }
}

Answer 2

I'm not as familiar with SASS, but why not pass $type directly:

&:#{$type} {
  content:$unicode;
  font-family:"FontAwesome";
  font-size:$size;
  color:$color;
  font-weight:$weight;
  margin:$margin;
  @content;
}