$duration: 0.15s;

.components-animation-slide-enter,
.components-animation-slide-appear {
  opacity: 0.1;
  transform: scaleY(0);
  transform-origin: top;
}
.components-animation-slide-enter-active,
.components-animation-slide-appear-active {
  opacity: 1;
  transform: scaleY(1);
  transform-origin: top;
  transition-property: transform, opacity;
  transition-duration: $duration;
  transition-timing-function: ease-in-out;
}

.components-animation-slide-exit {
  transform: scaleY(1);
  opacity: 1;
}
.components-animation-slide-exit-active {
  opacity: 0.1;
  transform-origin: top;
  transform: scaleY(0);
  transition-property: transform, opacity;
  transition-duration: $duration;
  transition-timing-function: ease-in-out;
}
