Transitionground

    .verticalRotation {
      view-transition-name: vertical-rotation-transition;
    }
    
    ::view-transition-old(vertical-rotation-transition) {
      backface-visibility: hidden; 
      animation: rotate-vertical-to-back 500ms ease-in-out 1 forwards;
    }
    
    ::view-transition-new(vertical-rotation-transition) {
      backface-visibility: hidden; 
      animation: rotate-vertical-from-back 500ms ease-in-out 1 forwards;
    }

    @keyframes rotate-vertical-to-back {
      from {
        transform: rotateX(0deg);
      }
      to {
        transform: rotateX(180deg);
      }
    }
    
    @keyframes rotate-vertical-from-back {
      from {
        transform: rotateX(-180deg);
      }
      to {
        transform: rotateX(0deg);
      }
    }