Merge pull request #497 from Safelite/feature/CSR-621

Feature/csr 621
This commit is contained in:
Mark Harris 2022-05-20 09:35:55 -04:00 committed by GitHub
commit b5529ce31b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 3 deletions

View file

@ -1,6 +1,7 @@
<template> <template>
<router-view v-slot="{ Component }"> <router-view v-slot="{ Component }">
<transition :duration="{ enter: 150, leave: 150 }" name="route-fade" mode="out-in"> <transition :duration="{ enter: 200, leave: 200 }" name="route-fade" mode="out-in">
<!-- The above durations should be kept in sync with the global css class "fade-on-route-transition" -->
<component :is="Component" /> <component :is="Component" />
</transition> </transition>
</router-view> </router-view>

View file

@ -12,11 +12,11 @@
} }
.route-fade-enter-active .fade-on-route-transition { .route-fade-enter-active .fade-on-route-transition {
transition: opacity 0.8s ease; transition: opacity 0.2s ease-out; //This duration should be kept in sync with the app.vue <transition> element attribute
} }
.route-fade-leave-active .fade-on-route-transition { .route-fade-leave-active .fade-on-route-transition {
transition: opacity 0.3s ease; transition: opacity 0.2s ease-in; //This duration should be kept in sync with the app.vue <transition> element attribute
} }
.route-fade-enter-from .fade-on-route-transition, .route-fade-enter-from .fade-on-route-transition,