Sass positioning mixin

_position.scss

/*
posiitoning utility
*/

/**
 * Set position and top, left, ...
 * @prop {string} $position
 * @prop {=number} $top
 * @prop {=number} $right
 * @prop {=number} $bottom
 * @prop {=number} $left
 *
 * ex. position(absolute, 0 10px)
 */
@mixin position ($position, $args: ()) {
  position: $position;
  @debug $args;

  @if length($args) == 1 {
    $n: nth($args, 1);
    $args: join($args, $n $n $n);
  } @else if length($args) == 2 {
    $args: join($args, $args);
  } @else if length($args) == 3 {
    $args: join($args, nth($args, 2));
  }

  @if length($args) > 0 {
    $positions: zip(top right bottom left, $args);
    
    @each $key, $value in $positions {
    @if $value != null {
      #{$key}: $value;
      }
    }
  }
}

/**
 * Aliase for each positions
 */
@mixin static ($args: ()) {
  @include position(static, $args);
}

@mixin relative ($args: ()) {
  @include position(relative, $args);
}

@mixin absolute ($args: ()) {
  @include position(absolute, $args);
}

@mixin sticky ($args: ()) {
  @include position(sticky, $args);
}

@mixin fixed ($args: ()) {
  @include position(fixed, $args);
}