DigitalConsumer.FixMyGlass/src/styles/common-animations.scss
Scott Kiener c3b3fda79f CSR-240 | Fade between page transitions
Two different approaches - PR created for review purposes
2022-05-03 16:04:49 -04:00

30 lines
No EOL
649 B
SCSS

.fade-enter-active {
transition: opacity 0.8s ease;
}
.fade-leave-active {
transition: opacity 0.3s ease;
}
.fade-enter-from,
.fade-leave-to {
opacity: 0;
}
.route-fade-enter-active .fade-on-route-transition {
transition: opacity 0.8s ease;
}
.route-fade-leave-active .fade-on-route-transition {
transition: opacity 0.3s ease;
}
.route-fade-enter-from .fade-on-route-transition,
.route-fade-leave-to .fade-on-route-transition {
/*
Hack around a Chrome 96 bug in handling nested opacity transitions.
This is not needed in other browsers or Chrome 99+ where the bug
has been fixed.
*/
opacity: 0.001;
}