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

1 vote321 views1 answer
What css font smoothing
CSS
13 votes324 views2 answers
How to middle text css
CSS
34 votes334 views4 answers
Css hide element
CSS
0 vote326 views1 answer
Sticky footer bootstrap 3
CSS
0 vote337 views2 answers
Skeumorphism box shadow
CSS
59 votes357 views6 answers
Css hover
CSS
14 votes321 views2 answers
Css grid command for responsive design
CSS
0 vote349 views1 answer
Exclude html content when print
CSS
0 vote381 views1 answer
Terminal download website source code
CSS
3 votes338 views2 answers
How to align elements horizontally in css
CSS