diff --git a/webpack/component/ue/manage.vue b/webpack/component/ue/manage.vue
index 32f4db3..9e08da6 100644
--- a/webpack/component/ue/manage.vue
+++ b/webpack/component/ue/manage.vue
@@ -4,12 +4,14 @@
-
+
diff --git a/webpack/component/ue/view.vue b/webpack/component/ue/view.vue
index 00d549f..fee4744 100644
--- a/webpack/component/ue/view.vue
+++ b/webpack/component/ue/view.vue
@@ -40,7 +40,7 @@
diff --git a/webpack/data/ue.js b/webpack/data/ue.js
index d364a1c..81a3589 100644
--- a/webpack/data/ue.js
+++ b/webpack/data/ue.js
@@ -539,36 +539,52 @@ gstore.add('ia_handler', function(ue_i){
-/* (9) Manage navigation in
+/* (9) Manage navigation
---------------------------------------------------------*/
/* (1) Initialize current opened UE */
-gstore.add('open_anim', {
- fade: -1
+gstore.add('nav_anim', {
+ in: false,
+ out: false
});
-/* (2) Define admin handler */
+/* (2) Manage nav in */
gstore.add('nav_in', function($router, ue_i){
/* (1) Abort if wrong ue_i */
if( ue_i == null || isNaN(ue_i) || gstore.get.ues[ue_i] == null)
return;
- /* (2) Set element to fade others */
- gstore.get.open_anim.fade = ue_i;
+ /* (2) Set animation class */
+ gstore.get.nav_anim.in = true;
- /* (3) Scale element */
- (new Promise((resolve,reject) => {
- setTimeout(() => {
- $router.push(`/ue/manage/${gstore.get.ues[ue_i].code}`);
- gstore.get.open_anim.fade = -1;
- }, 500 );
+ setTimeout( () => {
- /* (4) Load page */
- })).then(() => {
+ /* (3) Load page */
+ $router.push(`/ue/manage/${gstore.get.ues[ue_i].code}`);
- console.log('blu');
+ /* (4) Remove animation class */
+ gstore.get.nav_anim.in = false;
- });
+ }, 500 );
+
+
+});
+
+/* (3) Manage nav out */
+gstore.add('nav_out', function($router){
+
+ /* (1) Set animation class */
+ gstore.get.nav_anim.out = true;
+
+ setTimeout( () => {
+
+ /* (2) Load page */
+ $router.push(`/ue/view/`);
+
+ /* (3) Remove animation class */
+ gstore.get.nav_anim.out = false;
+
+ }, 500 );
});
\ No newline at end of file
diff --git a/webpack/scss/container.scss b/webpack/scss/container.scss
index a7824ee..5cb3c32 100644
--- a/webpack/scss/container.scss
+++ b/webpack/scss/container.scss
@@ -144,7 +144,7 @@
}
- @keyframes showup{
+ @keyframes bounce-up{
from{ transform: scale(.95); }
to{ transform: scale(1); }
}
@@ -164,8 +164,9 @@
border: 1px solid transparent;
box-shadow: 0 1px 1px darken(#fff, 20%);
- &:not([data-anim='0']){
- animation: showup .2s ease-out;
+ &:not([data-anim='0']),
+ &:not([data-anim-incoming='1']){
+ animation: bounce-up .2s ease-out;
}
@@ -182,13 +183,15 @@
// animation for outgoing element
@keyframes outgoing{
from{ transform: translateY(0); opacity: 1; }
- to{ transform: translateY(2em); opacity: 0; }
+ to{ transform: translateY(2em); opacity: 0; }
}
// animation to nav in
- &[data-anim-outgoing='1']{ animation: outgoing .4s ease-in-out; }
+ &[data-anim-outgoing='1']{ animation: outgoing .4s ease-in-out forwards; }
&[data-anim-incoming='1']{ animation: incoming .4s ease-in-out; }
+ &[data-anim-bounce='1']{ animation: bounce-up .6s ease-in-out reverse forwards; }
+
background-color: #fff;