:root::view-transition-old(*),
:root::view-transition-new(*) {
position: absolute;
inset-block-start: 0;
inline-size: 100%;
block-size: auto;
animation-duration: inherit;
animation-fill-mode: inherit;
animation-delay: inherit;
}
/* If there's both new and old */
:root::view-transition-old(transitionName) {
animation-name: -ua-view-transition-fade-out, -ua-mix-blend-mode-plus-lighter;
}
:root::view-transition-new(transitionName) {
animation-name: -ua-view-transition-fade-in, -ua-mix-blend-mode-plus-lighter;
}
/* Or if there's only new aka entering */
:root::view-transition-new(transitionName) {
animation-name: -ua-view-transition-fade-in;
}
/* Or if there's only old aka exiting */
:root::view-transition-old(transitionName) {
animation-name: -ua-view-transition-fade-out;
}