[Bugfix] Sticky - sticky-container should be 0px height when children…

[gehasia]

When you have a responsive menu ("drilldown medium-dropdown" for example) and you put the dropdown in sticky mode, if you resize the window to small size to get the drilldown appears, the height of the sticky container will remains as before and you'll have a blank div between your menu and content.

See a codepen here :
https://codepen.io/gehasia/pen/JXMZJB
Just resize from medium to small and you'll se the sticky container, in red, remaining in the small size, pushing the content...

The height of the sticky-container is calculated depending on his children "sticky" element height. When using the responsive menu, if we resize the window until the drilldown breakpoint, the "sticky" dropdown will stay at the same height, but will pass in display="none". The proposal patch just test if the sticky element is displayed or not, and, in the last case, set the height of the sticky-container to 0...

[gehasia]

I added another commit to bugfix for a different behavior :
With a sticky top-bar with different height depending on the .is-anchored or .is-sticky class and a css transition effect, there is a visual bug. The .sticky container does not resize when switching from anchored to sticky.
The patch force the _setSizes() after passing into sticky mode. It does it after waiting for all transition effects to be finished on the data-sticky element because if setSize() is fired before waiting for this, the setSize will get the wrong newContainerSize (the one before transition...).
I updated the code pen :
https://codepen.io/gehasia/pen/JXMZJB
Just see the red flashing when scrooling up and down..

[kball]

Looks good

[colin-marshall]

This messes up the sticky navigation example on the Sticky docs page. See #8645.