@orca-fe/pocket/lib/text-overflow/TextOverflow.style.js

UI components by orca-team

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _jssPluginAutoPrefix = _interopRequireDefault(require("@orca-fe/jss-plugin-auto-prefix"));
var _jss = require("../utils/jss");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var prefix = 'text-overflow';
var _default = exports.default = (0, _jss.createUseStyles)({
  root: {
    position: 'relative',
    overflow: 'hidden'
  },
  pauseOnHover: {
    '&:hover': {
      '& $textWrapper': {
        animationPlayState: 'paused'
      }
    }
  },
  placeHolder: {
    overflow: 'hidden',
    width: '100%',
    // visibility: 'hidden',
    pointerEvents: 'none',
    whiteSpace: 'nowrap',
    textAlign: 'center'
  },
  textWrapper: {
    position: 'absolute',
    top: '0',
    left: '0',
    animation: '$textOverflowAnimation 10000ms cubic-bezier(0.1, 0, 0.9, 1) infinite',
    visibility: 'hidden'
  },
  text: {
    position: 'absolute',
    top: '0',
    left: '0',
    whiteSpace: 'nowrap'
  },
  '@keyframes textOverflowAnimation': {
    '5%, 95%': {
      transform: 'translate3d(0, 0, 0)'
    },
    '45%, 50%, 55%': {
      transform: 'translate3d(-100%, 0, 0)'
    }
  }
}, {
  classNamePrefix: prefix,
  plugins: [(0, _jssPluginAutoPrefix.default)({
    prefix: prefix
  })]
});