@mixin propertyValues($properties, $values) {
  @each $property in $properties {
    @each $value in $values {
      $kebabValue: strReplace($value, ' ', '-');

      ".#{$property}--#{$kebabValue}" {
        #{$property}: #{$value};
      }

      ".#{$property}--#{$kebabValue}--important" {
        #{$property}: #{$value} !important;
      }
    }
  }
}

@mixin truncate() {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@mixin lowRes() {
  @media (max-width: $breakpoint), (max-height: $breakpoint-height) {
    @content;
  }
}

@mixin transition($props...) {
  $result: ();

  @for $i from 1 through length($props) {
    $prop: nth($props, $i);
    $result: append($result, $prop);
    $result: append($result, $transition);
    @if $i != length($props) {
      $result: append($result, unquote($string: ","));
    }
  }

  transition: $result;
}

@mixin transitionFast($props...) {
  $result: ();

  @for $i from 1 through length($props) {
    $prop: nth($props, $i);
    $result: append($result, $prop);
    $result: append($result, $transition-fast);
    @if $i != length($props) {
      $result: append($result, unquote($string: ","));
    }
  }

  transition: $result;
}
