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 vote149 views1 answer
Html css on class
CSS
0 vote117 views1 answer
Bootstrap 5 carosul height set
CSS
0 vote132 views1 answer
Crypto module
CSS
18 votes117 views4 answers
Css font arial
CSS
0 vote111 views1 answer
Operating system font-family css
CSS
1 vote151 views4 answers
CSS Grid Display
CSS
15 votes109 views2 answers
Npm scss
CSS
0 vote122 views1 answer
Display inline not alligned
CSS
3 votes124 views2 answers
Css crop image to circle
CSS
0 vote122 views1 answer
Align grid items with end
CSS