@meforma/vue-toaster/src/themes/default/animations.styl

Vue.js toaster notification

// Animations are taken from animate.css
// https://daneden.github.io/animate.css

@keyframes fadeOut
  from
    opacity 1
  to
    opacity 0

.fadeOut
  animation-name fadeOut

@keyframes fadeInDown
  from
    opacity .5
    transform translate3d(0, -100%, 0)
  to
    opacity 1
    transform none

.fadeInDown
  animation-name fadeInDown

@keyframes fadeInUp
  from
    opacity .5
    transform translate3d(0, 100%, 0)
  to
    opacity 1
    transform none

.fadeInUp
  animation-name fadeInUp

// VUE

.fade-enter-active
  transition opacity 300ms ease-in
.fade-leave-active
  transition opacity 150ms ease-out

.fade-enter,
.fade-leave-to
  opacity 0