79835163

Date: 2025-12-01 18:19:40
Score: 0.5
Natty:
Report link

Best thing to do would be to just get the .className at runtime. Crappy fix, but it'll work. Personally I have issues trying to programmatically apply animations because it transforms the css name but not any other reference to it in the file. The keyframes become s-VSwDfhj2prWB-opacityvisibleanimation but my code is element.style.animation = "1s forwards opacityvisibleanimation", which fails.
Even including it in the HTML segment fails, such as
style="animation: {expanded ? "1s forwards opacityvisibleanimation" : "1s forwards opacityinvisibleanimation"}".
I'm not sure how Rich intended us to reference animation names?

You'll need to do this at runtime.
in your .svelte:
element.className.match(/s-[\s\S]{12}/g)[0]

element being anything...

Now I can properly reference animation names:

element.style.animation = "1s forwards " + element.className.match(/s-[\s\S]{12}/g)[0] + "-opacityvisibleanimation"

Reasons:
  • Long answer (-0.5):
  • Has code block (-0.5):
  • Contains question mark (0.5):
  • Low reputation (1):
Posted by: user31978367