Is it possible to restart a CSS animation?
I have a side dock that acts as a device popup, and I want to quickly flash its opacity to give some feedback that the user has changed the device popup when they click on another device.
This site would suggest it’s not possible without js, or as a workaround, create two identical Styles with different names, then just switch between the two. I’ll do that in the meantime, but it’s a bit horrible 
Did you find a fix for this issue? I’m trying to do something similar after button click there is an intermediate state that takes 3s - using the opacity on an svg and “animate” by using that tied to a custom property. But so far no luck
No, never got a reply so I’m still using two identical styles and swapping between them 
it’s a bit dumb…
Hmmm…I’m not certain if it would work with perspective or not, but have you tried using CSS Transitions? Perhaps in combination with a :target?
I suppose it is dependent on how the pop ups are stored in the markup…
You can do some pretty interesting things with transforms and transitions, check out this for some examples of what I mean.
I haven’t tried this specifically but I haven’t had any luck with other CSS tricks and SVG images in Perspective - even with going into the theme, adding what I want, and then trying to apply the style. I would LOVE to find a way to actually make them play nice together though, I’m just not certain it exists at this point.
I did the “switch between two identical animated styles”. It wasn’t totally obvious, but no too horrible 
It seems to work pretty well