// Font face
///
/// @param {string} $style-name
/// @param {string} $file
/// @param {string} $family
/// @param {string} $category
/// @param {number} $weight
///
@mixin x-font-face($style-name, $file, $family, $category: "", $weight: 400) {
  $filepath: "../fonts/" + $family + "/" + $file;
  @font-face {
    -webkit-font-smoothing: antialiased;
    font-family: "#{$style-name}";
    font-style: normal;
    font-variant: normal;
    font-weight: $weight;
    src: url("#{$filepath}.eot?#iefix") format("eot"),
    url("#{$filepath}.woff2") format("woff2"),
    url("#{$filepath}.woff") format("woff"),
    url("#{$filepath}.ttf") format("truetype"),
    url("#{$filepath}.svg##{$style-name}") format("svg");

  }

  @media screen and (-webkit-min-device-pixel-ratio: 0) {
    @font-face {
      font-family: "#{$style-name}";
      font-weight: $weight;

      src: url("#{$filepath}.svg##{$style-name}") format("svg");
    }
  }
}

// Font size
///
/// @param {number} $sizeValue
///
@mixin x-font-size($size-value: 1.5) {
  font-size: ($size-value * 10) + px;
  font-size: $size-value + rem;
}