<template>
  <teleport to="body">
    <transition name="dialog">
      <slot />
    </transition>
  </teleport>
</template>

<style lang="scss">
.dialog-leave-to dialog > div,
.dialog-enter-from dialog > div {
  opacity: 0;
}

.dialog-leave-to dialog main,
.dialog-enter-from dialog main {
  opacity: 0;
  transform: scale3d(0.85, 0.85, 1) translate3d(0, calc(var(--cp-dimensions-1) * 7.5), 0);
}
</style>
