I have a little friendly 'waving hand' emoji on my /about and /hello pages but thought "wouldn't it be more welcoming if they actually waved?"
Well, now they do...
Just for a few seconds after the page loads, using a simple bit of CSS:
@keyframes wave {
0%, 100% { transform: rotate(0deg); }
10%, 30%, 50%, 70%, 90% { transform: rotate(20deg); }
20%, 40%, 60%, 80% { transform: rotate(-20deg); }
}
.waving-hand {
display: inline-block;
animation: wave 3s ease-in-out 1;
}
That deserves a star in Reeder. Awesome!
😂