Nuxt page transition

.layout-enter-active,
.page-enter-active,
.layout-leave-active,
.page-leave-active {
    transition: opacity 400ms, transform 400ms;
}

.layout-enter,
.page-enter {
    opacity: 0;
    transform: translate3d(0, 20px, 0);
}

.layout-enter-to,
.page-enter-to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.layout-leave,
.page-leave {
    opacity: 1;
}

.layout-leave-to,
.page-leave-to {
    opacity: 0;
}

Source: nuxtjs.org

Similar codes

0 vote269 views1 answer
Css animate svg circle radius
CSS
0 vote274 views5 answers
How many px is iphone 12 pro max css
CSS
0 vote266 views2 answers
Fixed footer in Bootstrap
CSS
2 votes279 views1 answer
Background gradient problem
CSS
1 vote274 views1 answer
How to hide the bullet list css
CSS
0 vote275 views1 answer
Css chess pieces
CSS
2 votes256 views1 answer
Css how do i remove highlighting
CSS
0 vote271 views1 answer
Mat slider custom color
CSS
6 votes289 views5 answers
Remove line from a href css
CSS
27 votes284 views6 answers
Html color codes
CSS