This task is the second part of this one.

"Something we should also do (could be as a separate commit) is making these separate images instead of a sprite. This is one of (if not, the) last sprite in existence in MediaWiki core, and I'd love to get rid of it - and the background position trickery that comes with - in favour of the established standard of using (automated, ResourceLoader) image embedding, instead.

That would also make the comparison and handling of these images a bit easier.

If you're interested in doing that, I'd recommend doing that in the same commit, or as a separate commit before this one (so we'd split the PNGs, add svgs, remove the GIF, and replace active state with a css rotating transition, the fallback would be non-rotating for both PNG and SVG ?)."

https://gerrit.wikimedia.org/r/#/c/98856/

Create and integrate an SVG version, and use CSS animation for interactive state. Possibly unifying with mobile assets (bug 54307). See this bug report for more information. This task is part of larger efforts to make MediaWiki high-density display friendly. This task requires existing graphics skills working with a Vector graphics application (e.g. Inkscape). Links to SVG file(s) that you have created are welcome. Basic knowledge of CSS might also be helpful for integration. Students are required to read Wikimedia's general instructions first.