Conditional Card Animation

[Camatobe]

Conditional Cards on Dashboards.

I use them quite often (for example, when music starts playing, I display some cards to control devices, which are hidden when silent).

When a state change occurs, the cards pop in instantly, moving existing cards.

My feature request concerns the animation. Upon a state change, instead of just a display:block, there should be an additional CSS animation:

1.	Slowly transition (e.g., 600ms transition) the height of the container of the new card from 0% to 100%.
2.	Fade in the new card, possibly coupled with a scale(0.9)->(1) transformation (pivot point center).

The other cards would be gently pushed aside, and the new card would appear with a subtle animation.

This small change in user experience makes the dashboard feel more dynamic and modern.

Potentially a nice quick win.
What do you think?

[noxhirsch]

I strongly disagree. I use a lot of conditional cards and would find it very irritating if they all animate in and out - especially in a two staged animation. Additionally, there might be performance issues on slow devices. You'd also have to make sure that the animation isn't triggered on first load. If it is animated, then it should be an elegant, subtle animation - like that the card grows in height for 600ms while fading in for the first 200ms.
In any case, if an animation would be implemented in HA, then the animation or the length of the animation should be a theme variable so that you can disable the animation (or the animation is off by default, like the background blur behind the more-info-dialogs).