@sky-mavis/tanto-widget/dist/cjs/styles/animations.cjs

Tanto Widget

'use strict';

var react = require('@emotion/react');

const fadeIn = react.keyframes`
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
`;
const fadeOut = react.keyframes`
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
`;
const fadeInUp = react.keyframes`
  from {
    opacity: 0;
    transform: scale(0.97);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
`;
const fadeOutDown = react.keyframes`
  from {
    opacity: 1;
    transform: scale(1);
  }
  to {
    opacity: 0;
    transform: scale(0.97);
  }
`;
const spin = react.keyframes`
  to {
    transform: rotate(1turn);
  }
`;
const shake = react.keyframes`
  0% {
    transform: none;
  }
  25% {
    transform: translateX(2px);
  }
  50% {
    transform: translateX(-2px);
  }
  75% {
    transform: translateX(2px);
  }
  100% {
    transform: none;
  }
`;
const shine = react.keyframes`
  0% {
    background-position: 0% 0;
  }
  100% {
    background-position: -200% 0;
  }
`;

exports.fadeIn = fadeIn;
exports.fadeInUp = fadeInUp;
exports.fadeOut = fadeOut;
exports.fadeOutDown = fadeOutDown;
exports.shake = shake;
exports.shine = shine;
exports.spin = spin;