Vaadin 8 - CSS animation of one component in a layout

Hi,

I’m trying to add a component (a VerticalLayout) as right-most element of a HorizontalLayout (or a CssLayout - doesn’t make much difference). That component is animated with rotateY. On pressing a button, it appears, pressing the button again, it disappears. Pretty similar to the sampler on https://demo.vaadin.com/sampler.

However, up to now I could not make the left component in the layout dynamically shrink when the animated component appears, and to occupy the space freed by the disappearing component. Making the animated component visible/invisible works, but that does not lead to the dynamic shrinking/expansion as shown in the sampler.

Also animating the left component, increasing/decreasing the width makes the rotation of the other component look strange, and depending on the content of the left component, it does not always follow the increase/decrease of the width - probably because animation is a pure client-side action, and some elements are not redrawn due to the missing trigger on server side.

Has somebody a solution for this with Vaadin 8? Thanks in advance!

Regards
Jochen