diff options
| -rw-r--r-- | src/components/AppNavigation/AppNavigation.vue | 3 | ||||
| -rw-r--r-- | src/components/Global/LoadingBar.vue | 4 | ||||
| -rw-r--r-- | src/components/Global/TableToolbar.vue | 3 |
3 files changed, 7 insertions, 3 deletions
diff --git a/src/components/AppNavigation/AppNavigation.vue b/src/components/AppNavigation/AppNavigation.vue index 233d496a..fb50f5ec 100644 --- a/src/components/AppNavigation/AppNavigation.vue +++ b/src/components/AppNavigation/AppNavigation.vue @@ -238,7 +238,8 @@ svg { transition: opacity $duration--fast-02 $exit-easing--productive; } - &.fade-enter, + &.fade-enter, // Remove this vue2 based only class when switching to vue3 + &.fade-enter-from, // This is vue3 based only class modified from 'fade-enter' &.fade-leave-to { opacity: 0; } diff --git a/src/components/Global/LoadingBar.vue b/src/components/Global/LoadingBar.vue index 1034de64..0e9551b5 100644 --- a/src/components/Global/LoadingBar.vue +++ b/src/components/Global/LoadingBar.vue @@ -80,7 +80,9 @@ export default { opacity: 1; transition: opacity $duration--moderate-01 $standard-easing--productive; height: 0.4rem; - &.fade-enter, + + &.fade-enter, // Remove this vue2 based only class when switching to vue3 + &.fade-enter-from, // This is vue3 based only class modified from 'fade-enter' &.fade-leave-to { opacity: 0; } diff --git a/src/components/Global/TableToolbar.vue b/src/components/Global/TableToolbar.vue index d22b37fc..4baf8368 100644 --- a/src/components/Global/TableToolbar.vue +++ b/src/components/Global/TableToolbar.vue @@ -103,7 +103,8 @@ $toolbar-height: 46px; .slide-leave-active { transition: transform $duration--moderate-02 $exit-easing--productive; } -.slide-enter, +.slide-enter, // Remove this vue2 based only class when switching to vue3 +.slide-enter-from, // This is vue3 based only class modified from 'slide-enter' .slide-leave-to { transform: translateY($toolbar-height); } |