Great intro to CSS Flexbox. I learned a few new tricks, such as using a nested flexbox to center content vertically. Pretty cool.

A caution about listening for transitionend and toggling a class when it has ended. If the transition is interrupted or reversed such as with a double click, you can end up with the transitionend listener firing on the wrong ending.

I think it's better to explicitly add and remove classes in this case which gives more control in case a transition is interrupted. I've implemented this simple change in my code and you can see how it doesn't permit the two animations to become detached in the case of a double-click.

Completion Time: ~20 Minutes

You can sign up for Javascript30 here:

You can view my gallery here:

You can see my code here: