styletron icon indicating copy to clipboard operation
styletron copied to clipboard

Allow for multiple animations

Open leyanlo opened this issue 2 years ago • 0 comments

Today, Styletron lets you add an animation with animationName, which takes in a KeyframesObject. However, CSS allows for multiple animations to be set, separated by commas, e.g.

animation: oscillate .8s 10s ease-in infinite, 
           expand 2s 4s ease-in infinite,
           move-clockwise-in 3s ease-in,
           toggle-bg-color-in 11s ease-in;

I don’t think there’s an easy way to update animationName to take in an array of KeyFrameObjects, since we would still have the problem of being able to set multiple durations/delays/timings/durations. Would it be possible to expose the renderKeyframes return value so we could do this ourselves in CSS?

leyanlo avatar Jul 25 '23 10:07 leyanlo