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 vote364 views1 answer
Add glow to image css
CSS
35 votes350 views6 answers
Ellipsis
CSS
0 vote355 views1 answer
Get clicked position javascript image
CSS
1 vote344 views1 answer
Will change css
CSS
0 vote390 views1 answer
Calc css float to procent
CSS
51 votes371 views4 answers
Css center horizontally
CSS
5 votes351 views6 answers
Ruby cheat sheet
CSS
12 votes341 views4 answers
Padding in one line
CSS
-1 vote321 views1 answer
Scss npm import
CSS
47 votes392 views6 answers
Css blur
CSS