animista-css-generator
Version:
Animista CSS Generator
29 lines (25 loc) • 898 B
JavaScript
const { cssHash } = require('css-hash');
const generator = require('../generator');
const animationClass = cssHash(
(className) => `
${generator.keyframes(
className,
`
0% {
text-shadow: 0 0 #555555, 0 0 #555555, 0 0 #555555, 0 0 #555555, 0 0 #555555, 0 0 #555555, 0 0 #555555, 0 0 #555555;
${generator.fields('transform: translateX(0) translateY(0)')}
}
100% {
text-shadow: -1px -1px #555555, -2px -2px #555555, -3px -3px #555555, -4px -4px #555555, -5px -5px #555555, -6px -6px #555555, -7px -7px #555555, -8px -8px #555555;
${generator.fields('transform: translateX(8px) translateY(8px)')}
}
`,
)}
.${className} {
${generator.fields(
`animation: ${className} var(--animate-duration) both`,
)}
}
`,
);
module.exports = animationClass;