@import "settings.animations";

@mixin range {
  &::-webkit-slider-thumb {
    transition: transform;
    transition-duration: $animation-duration;
    transition-timing-function: $animation-easing;
  }
  &::-moz-range-thumb {
    transition: transform;
    transition-duration: $animation-duration;
    transition-timing-function: $animation-easing;
  }
  &::-ms-thumb {
    transition: transform;
    transition-duration: $animation-duration;
    transition-timing-function: $animation-easing;
  }
}

@mixin range--slow {
  &::-webkit-slider-thumb {
    transition-duration: $animation-duration-slow;
  }
  &::-moz-range-thumb {
    transition-duration: $animation-duration-slow;
  }
  &::-ms-thumb {
    transition-duration: $animation-duration-slow;
  }
}

@mixin range--fast {
  &::-webkit-slider-thumb {
    transition-duration: $animation-duration-fast;
  }
  &::-moz-range-thumb {
    transition-duration: $animation-duration-fast;
  }
  &::-ms-thumb {
    transition-duration: $animation-duration-fast;
  }
}