l-hammer/YDTemplate

/**
 * 打字效果
 */

@keyframes typing {
  from {
    width: 0;
  }
}

@keyframes caret {
  50% {
    border-right-color: currentColor
  }
}

/**
 * loading
 */

@keyframes progress-loading {
  to {
    background-position: 200% 0;
  }
}

@keyframes circle-loading {
  from {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(180deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/**
 * fadein
 */

@keyframes dialog-fadein {
  0% {
    opacity: 0
  }
  to {
    opacity: 1
  }
}

@keyframes dialog-zoom {
  0% {
    transform: scale(0)
  }
  50% {
    transform: scale(1.1)
  }
  to {
    transform: scale(1)
  }
}

.dialog-fade-enter-active {
  animation: dialog-fadein .4s
}

.dialog-fade-enter-active .dialog-container {
  animation: dialog-zoom .4s
}

/**
 * wave
 */
@keyframes wave {
  to {
      background-position: 200% 0;
  }
}
@keyframes wave-reverse{
  to {
      background-position: -200% 0;
  }
}

/**
 * rotate
 */
@keyframes rotate {
  to {
    transform: rotate(1turn);
  }
}

/**
 * zoom
 */
@keyframes zoomIn {
  0% {
    opacity: 0;
    transform: scale3d(.3, .3, .3);
  }
  100% {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}

@keyframes zoomOut {
  0% {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
  100% {
    opacity: 0;
    transform: scale3d(.3, .3, .3);
  }
}

.zoom-enter,
.zoom-enter-active {
  animation: zoomIn .25s linear;
}

.zoom-leave-active,
.zoom-leave-to {
  animation: zoomOut .25s linear;
}

@keyframes shake {
  from {
    border: 1px solid #ffeea6;
  }
  to {
    border: 1px solid white;
    box-shadow: 0 0 .693333rem white;
  }
}