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 vote161 views2 answers
Use font awesome as content in css
CSS
0 vote133 views1 answer
Css conver innertext to html using css
CSS
8 votes133 views1 answer
Html watermark background
CSS
118 votes213 views6 answers
Css @media
CSS
0 vote153 views1 answer
Apply image as full screen responsive background
CSS
10 votes131 views5 answers
Text-align property in css
CSS
0 vote93 views1 answer
Flex-decoration column
CSS
2 votes132 views2 answers
How to make a list vertical in css
CSS
1 vote258 views1 answer
Css minifier api
CSS
1 vote105 views1 answer
Html hide text if too long
CSS