If you want to see the previous Code Pen I did, check out A Simple ⭐ Rating Code Pen.
Continuing along with my 2018 Resolutions to make Code Pens this year, here is my latest.
A fun little poop notification component. Maybe Squatty Potty can use it 😂 (watch their commercial if you're having a bad day).
One of the reasons I wanted to start making Code Pens was to see how much I can do without the help of JS. In this example, Javascript is only used to increment a CSS variable.
The easiest way to work on the hover effect is to use the "force state" feature in Chrome. See it in action at 2:40, the Bonus Tip! part of the What's New in DevTools video on how to work with "force state".
Yes, the poop emoji looks like a pilgrim. That's the best I could do for their hat for now. That's all folks. Now go hover over that 💩 notification!
See the Pen https://codepen.io/nickytonline/pen/ppMmyZ by nickytonline (@nickytonline) on CodePen.