@import '../mixins/mixins';
@import '../variables/colors';
@import '../mixins/mixins';

$icon-width: 16;
$icon-height: 16;

$sprite: (
  (0, 0, 0, 0, 0, 0, 0, 1, 1, 0, 0, 0, 0, 0, 0, 0),
  (0, 0, 0, 0, 0, 0, 1, 5, 4, 1, 0, 0, 0, 0, 0, 0),
  (0, 0, 0, 0, 0, 0, 1, 5, 4, 1, 0, 0, 0, 0, 0, 0),
  (0, 0, 0, 0, 0, 1, 5, 3, 3, 4, 1, 0, 0, 0, 0, 0),
  (0, 0, 0, 0, 0, 1, 5, 3, 3, 4, 1, 0, 0, 0, 0, 0),
  (0, 0, 0, 0, 1, 5, 3, 1, 1, 3, 4, 1, 0, 0, 0, 0),
  (0, 0, 0, 0, 1, 5, 3, 1, 1, 3, 4, 1, 0, 0, 0, 0),
  (0, 0, 0, 1, 5, 3, 3, 1, 1, 3, 3, 4, 1, 0, 0, 0),
  (0, 0, 0, 1, 5, 3, 3, 1, 1, 3, 3, 4, 1, 0, 0, 0),
  (0, 0, 1, 5, 3, 3, 3, 1, 1, 3, 3, 3, 4, 1, 0, 0),
  (0, 0, 1, 5, 3, 3, 3, 1, 1, 3, 3, 3, 4, 1, 0, 0),
  (0, 1, 5, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 4, 1, 0),
  (0, 1, 5, 3, 3, 3, 3, 1, 1, 3, 3, 3, 3, 4, 1, 0),
  (1, 5, 3, 3, 3, 3, 3, 1, 1, 3, 3, 3, 3, 3, 4, 1),
  (1, 5, 3, 3, 3, 3, 3, 3, 3, 3, 3, 4, 4, 4, 4, 1),
  (0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 0)
);

$sprite-colors: (
  #000000,
  #ffffff,
  $color-sunshine,
  $color-ember,
  color-mix(in srgb, $color-sunshine, white 55%),
);

@mixin warning-icon($icon-pixel-dimmension) {
  @include render-icon(
    $icon-pixel-dimmension,
    $icon-width,
    $icon-height,
    $sprite,
    $sprite-colors
  );
}

@mixin warning-icon-before($icon-pixel-dimmension) {
  @include render-icon-before(
    $icon-pixel-dimmension,
    $icon-width,
    $icon-height,
    $sprite,
    $sprite-colors
  );
}
