@import "./fadingEntrances.scss";
@import "./fadingExits.scss";

.#{$animation-prefix}fade-enter-active {
  animation: fadeIn $animation-time;
}
.#{$animation-prefix}fade-leave-active {
  animation: fadeOut $animation-time;
}

// 弹出下拉框过渡，SelectDropDwon
.#{$animation-prefix}drop-enter-active,
.#{$animation-prefix}drop-leave-active {
  opacity: 1;
  transform: scaleY(1);
  transition: transform $animation-time cubic-bezier(0.23, 1, 0.32, 1),
    opacity $animation-time cubic-bezier(0.23, 1, 0.32, 1);
}
[x-placement^="top"] {
  &.#{$animation-prefix}drop-enter-active,
  &.#{$animation-prefix}drop-leave-active {
    transform-origin: center bottom;
  }
}
[x-placement^="bottom"] {
  &.#{$animation-prefix}drop-enter-active,
  &.#{$animation-prefix}drop-leave-active {
    transform-origin: center top;
  }
}
.#{$animation-prefix}drop-enter,
.#{$animation-prefix}drop-leave-active {
  opacity: 0;
  transform: scaleY(0);
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
.animated.delay-1s {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}
.animated.delay-2s {
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}
.animated.delay-3s {
  -webkit-animation-delay: 3s;
  animation-delay: 3s;
}
.animated.delay-4s {
  -webkit-animation-delay: 4s;
  animation-delay: 4s;
}
.animated.delay-5s {
  -webkit-animation-delay: 5s;
  animation-delay: 5s;
}
.animated.fast {
  -webkit-animation-duration: 800ms;
  animation-duration: 800ms;
}
.animated.faster {
  -webkit-animation-duration: 500ms;
  animation-duration: 500ms;
}
.animated.slow {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}
.animated.slower {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}
@media (prefers-reduced-motion) {
  .animated {
    -webkit-animation: unset !important;
    animation: unset !important;
    -webkit-transition: none !important;
    transition: none !important;
  }
}