nuxt-glorious 1.2.2-7 → 1.2.2-8

package/dist/module.json

@@ -1,5 +1,5 @@
 {
   "name": "glorious",
   "configKey": "glorious",
-  "version": "1.2.2-7"
+  "version": "1.2.2-8"
 }

package/dist/runtime/assets/style/components/modal.css

@@ -31,11 +31,11 @@
 .glorious-scaffold-modal.close {
   @apply hidden;
 }
-.glorious-scaffold-modal.open {
+.glorious-scaffold-modal.open.animation {
   animation: animationMobile 0.3s normal forwards;
 }
 @screen md {
-  .glorious-scaffold-modal.open {
+  .glorious-scaffold-modal.open.animation {
     animation: animationOpacity 0.3s normal forwards;
   }
 }
@@ -61,6 +61,6 @@
     transform: translateY(0);
   }
   100% {
-    transform: translateY(1);
+    transform: translateY(0);
   }
 }

package/dist/runtime/components/G/Modal.vue

@@ -67,12 +67,21 @@ const addBlurBackground = (): void => {
 watch(
   () => props.modelValue,
   () => {
+    const modals = document.querySelectorAll(".glorious-scaffold-modal");
     if (props.modelValue && props.blur) {
       addBlurBackground();
+      setTimeout(() => {
+        modals.forEach((el: any) => {
+          el.classList.remove("animation");
+        });
+      }, 500);
     } else {
       const blur: any = document.querySelector(
         ".glorious-scaffold-modal-bg-blur"
       );
+      modals.forEach((el: any) => {
+        el.classList.add("animation");
+      });
       if (blur !== null) blur.remove();
     }
   }
@@ -81,7 +90,7 @@ watch(
 
 <template>
   <div
-    class="glorious-scaffold-modal"
+    class="glorious-scaffold-modal animation"
     :class="[props.modelValue ? 'open' : 'close', `size-${props.size}`]"
   >
     <!-- header -->
@@ -153,11 +162,11 @@ watch(
 .glorious-scaffold-modal.close {
   @apply hidden;
 }
-.glorious-scaffold-modal.open {
+.glorious-scaffold-modal.open.animation {
   animation: animationMobile 0.3s normal forwards;
 }
 @screen md {
-  .glorious-scaffold-modal.open {
+  .glorious-scaffold-modal.open.animation {
     animation: animationOpacity 0.3s normal forwards;
   }
 }
@@ -183,7 +192,7 @@ watch(
     transform: translateY(0);
   }
   100% {
-    transform: translateY(1);
+    transform: translateY(0);
   }
 }
 </style>

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.2.2-7",
+  "version": "1.2.2-8",
   "name": "nuxt-glorious",
   "description": "This package provides many things needed by a project, including server requests and authentication, SEO and other requirements of a project.",
   "repository": "sajadhzj/nuxt-glorious",