@import '../animation/variables.scss';

// 图标
@import '../material-icons/material-icons.scss';

// mixin
@import './ivue-icon-mixin.scss';

$icon-size: 24px;

.ivue-icon {
  @include ivue-icon-size($icon-size);
  @include ivue-icon;

  &.ivue-size-2x {
    @include ivue-icon-size($icon-size * 2);
  }

  &.ivue-size-3x {
    @include ivue-icon-size($icon-size * 3);
  }

  &.ivue-size-4x {
    @include ivue-icon-size($icon-size * 4);
  }

  &.ivue-size-5x {
    @include ivue-icon-size($icon-size * 5);
  }
}

.ivue-icon-image {
  svg {
    height: 100%;
    flex: 1;
    transition: fill 0.4s $ivue-transition-default-timing;
  }
}