Is there any way to reverse the direction of the fan spin animation? I know I’m being exceptionally pedantic here, but the fan in my son’s room spins counter clockwise and aesthetically it would be nice if the animation matched.
I tried being smart and setting the height negative in custom css in the hopes that might invert the icon - it does not!
It’s a CSS Animation so you can use Custom CSS and set the 'animation-direction' to 'reverse'.
This would reverse the spin animation for all fan speed icons.
.tile.fan-speed .icon.fa-spin { animation-direction: reverse; }
Please note that any custom CSS snippets provided are not officially supported and may need to be adjusted with potential future changes to the SharpTools web app.
Edit: There’s a bunch of other interesting CSS snippets in the community maintained CSS Wiki:
[WIKI] Custom CSS snippets, verified on SharpTools
And here’s a tip on how to apply a CSS snippet to just a particular named style that you can choose to apply to one or more tiles rather than all tiles – for example, just your son’s fan rather than on all fans:
Thanks Josh. Yes, I’ve been messing with Custom CSS quite a bit but hadn’t found the animation-direction command. That worked perfectly, thank you sir!