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 vote206 views2 answers
Vim unset number
CSS
168 votes200 views4 answers
Css link tag
CSS
0 vote188 views1 answer
Menu always center css
CSS
0 vote204 views1 answer
Navbar bootstrap display items horizontally
CSS Bootstrap
17 votes189 views2 answers
Css grid center elements inside div
CSS
1 vote160 views1 answer
Css access span class inside div
CSS
20 votes168 views5 answers
How to add background image in react css
CSS
0 vote161 views1 answer
Javafx set border outside
CSS
4 votes154 views2 answers
Bootstrap icons sdn
CSS
71 votes177 views6 answers
Css center image
CSS