Wikipedia viewer: search box expands but doesn't contract

Please take a look a this codepen and help if you can!

Sorry, but that link isn’t working. And sorry, it’s time for bed.

Here’s some stuff on CSS animations. I didn’t use “font awesome” classes and instead cobbled together my own CSS - but probably the reason why you get a smooth transition one way but a stark one back will come down to the presence (or absence) of the “transition” property in the CSS somewhere (maybe look at the base class to begin with?)

This is a really handy resource for DIY CSS: