How @support works?

For Hacktoberfest I am currently working on an issue, where I did find the solution itself pretty fast, but stuck with CSS.

I never used Animation in CSS. I never used @support in CSS. Trying to figure out the right way slows the speed pretty down.

Codebase

When looking at the the element, it works as expected in Chrome and Firefox, but not in Safari. Turns out that the cool animation effect which is set via ::before and ::after selector …

animation codebase codepen css down fast find hacktoberfest issue safari solution speed support working