React Transition Group random quote machine

I can not figure out how to transition the resize of my #quote-box.

I got the background color transition to work, but for some reason, this doesn’t work on the size of the #quotebox or transitioning the actual text.

I think that react is essentially removing the first #quotebox and replacing/re-rendering a completely new one, and I’ve tried using the Transition/CSSTransition add-ons, but I can not get it to work. All of the documentation and examples I can find/understand only use it for mounting and unmounting the same component like toggling a menu.

Please help.

Here is a link to my github with the code. https://github.com/ATown0789/random-quote-machine/tree/master/src