Feature request: Animate background and modal separately

[websocket98765]

Feature request

I just upgraded from v4 to v5.

In v4, I had a really beautiful animation, where the background faded in very quickly and then the modal body slid in just a bit slower.

// Fade in/out the modal background.
.transitionEnter {
  opacity: 0;
}

.transitionEnterActive {
  opacity: 1;
  transition: opacity 0.1s linear;
}

.transitionExit {
  opacity: 1;
}

.transitionExitActive {
  opacity: 0;
  transition: opacity 0.1s linear;
}

// Slide the modal body in and out, but not the modal background.
.transitionEnter .modal-body {
  transform: translateY(-70px);
}

.transitionEnterActive .modal-body {
  transform: translateY(0);
  transition: transform 0.33s ease;
}

.transitionExit .modal-body {
  transform: translateY(0);
}

.transitionExitActive .modal-body {
  transform: translateY(-70px);
  transition: transform 0.4s ease;
}

It does not appear possible to animate these separately in v5.

Describe the solution you'd like

I'd like the ability to animate the modal background and modal body separately to achieve the above. It felt very fast, refined, and smooth, which I'm unable to achieve in v5.

[pradel]

Hey all, I just published v6.0.0, take a look at the custom animations section of the website, you can now animate background and modal separately 🎉