cloudhubui/dist/animate/variants/background/BackgroundPan.js

Various components to use in react projects

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.varPanRight = exports.varPanLeft = exports.varPanBottom = exports.varPanTop = void 0;
// ----------------------------------------------------------------------
var TRANSITION = {
  duration: 4,
  ease: 'linear'
};

var gradient = function gradient(deg) {
  return "linear-gradient(".concat(deg, "deg, #ee7752, #e73c7e, #23a6d5, #23d5ab)");
};

var varPanTop = {
  animate: {
    backgroundImage: [gradient(0), gradient(0)],
    backgroundPosition: ['center 99%', 'center 1%'],
    backgroundSize: ['100% 600%', '100% 600%'],
    transition: TRANSITION
  }
};
exports.varPanTop = varPanTop;
var varPanBottom = {
  animate: {
    backgroundImage: [gradient(0), gradient(0)],
    backgroundPosition: ['center 1%', 'center 99%'],
    backgroundSize: ['100% 600%', '100% 600%'],
    transition: TRANSITION
  }
};
exports.varPanBottom = varPanBottom;
var varPanLeft = {
  animate: {
    backgroundPosition: ['99% center', '1% center'],
    backgroundImage: [gradient(270), gradient(270)],
    backgroundSize: ['600% 100%', '600% 100%'],
    transition: TRANSITION
  }
};
exports.varPanLeft = varPanLeft;
var varPanRight = {
  animate: {
    backgroundPosition: ['1% center', '99% center'],
    backgroundImage: [gradient(270), gradient(270)],
    backgroundSize: ['600% 100%', '600% 100%'],
    transition: TRANSITION
  }
};
exports.varPanRight = varPanRight;