@import "var";

// 动画:fade in
.qf-fade-enter-active {
  transition: opacity .5s
}

.qf-fade-enter, .qf-fade-leave-to {
  opacity: 0
}

.qf-fade-in-linear-enter-active,
.qf-fade-in-linear-leave-active {
  transition: $--fade-linear-transition;
}

.qf-fade-in-linear-enter,
.qf-fade-in-linear-leave,
.qf-fade-in-linear-leave-active {
  opacity: 0;
}

.qf-zoom-in-top-enter-active, .qf-zoom-in-top-leave-active {
  opacity: 1;
  transform: scaleY(1);
  transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1);
  transform-origin: center top
}

.qf-zoom-in-top-enter, .qf-zoom-in-top-leave-active {
  opacity: 0;
  transform: scaleY(0)
}

.qf-zoom-in-center-enter-active, .qf-zoom-in-center-leave-active {
  transition: all .3s cubic-bezier(.55, 0, .1, 1)
}

.qf-zoom-in-center-enter, .qf-zoom-in-center-leave-active {
  opacity: 0;
  transform: scaleX(0)
}

.qf-zoom-in-bottom-enter-active, .qf-zoom-in-bottom-leave-active {
  opacity: 1;
  transform: scaleY(1);
  transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1);
  transform-origin: center bottom
}

.qf-zoom-in-bottom-enter, .qf-zoom-in-bottom-leave-active {
  opacity: 0;
  transform: scaleY(0)
}

.qf-zoom-in-left-enter-active, .qf-zoom-in-left-leave-active {
  opacity: 1;
  transform: scale(1, 1);
  transition: transform .3s cubic-bezier(.23, 1, .32, 1), opacity .3s cubic-bezier(.23, 1, .32, 1);
  transform-origin: top left
}

.qf-zoom-in-left-enter, .qf-zoom-in-left-leave-active {
  opacity: 0;
  transform: scale(.45, .45)
}