diff options
| author | Roger Braun <roger@rogerbraun.net> | 2016-11-28 14:35:21 +0100 |
|---|---|---|
| committer | Roger Braun <roger@rogerbraun.net> | 2016-11-28 14:35:21 +0100 |
| commit | 6fad01339cb3f8514429d03869a9c8ff2a343b02 (patch) | |
| tree | ae285785bad1d8600367aca3085a6ec9782ad71c | |
| parent | c9604eec9dd5d507a84d7e3de0365792e05a1d18 (diff) | |
Add some cheap transition anymation.
| -rw-r--r-- | src/App.scss | 7 | ||||
| -rw-r--r-- | src/App.vue | 4 |
2 files changed, 10 insertions, 1 deletions
diff --git a/src/App.scss b/src/App.scss index 47886e31..d96cecd7 100644 --- a/src/App.scss +++ b/src/App.scss @@ -263,3 +263,10 @@ attention { nav { z-index: 1000; } + +.fade-enter-active, .fade-leave-active { + transition: opacity .2s +} +.fade-enter, .fade-leave-active { + opacity: 0 +} diff --git a/src/App.vue b/src/App.vue index dd05c569..e46419e0 100644 --- a/src/App.vue +++ b/src/App.vue @@ -11,7 +11,9 @@ <nav-panel></nav-panel> <notifications v-if="currentUser"></notifications> </sidebar> - <router-view></router-view> + <transition name="fade"> + <router-view></router-view> + </transition> </div> </div> </template> |