js modal

assets/css/gp-style-core.css

@@ -797,29 +797,41 @@ button{
   background: rgba(0, 0, 0, 0.25);
 
   z-index: 200;
+
+  opacity: 0;
+  transition: opacity .2s ease-out;
+  pointer-events: none;
+}
+.modal.active{
+  opacity: 1;
+  pointer-events: auto;
 }
 .modal__aside{
   position: fixed;
   top: 0;
   right: 0;
 
-  width: auto;
+  width: 0;
   height: 100%;
 
   overflow: hidden;
+  transition: width .4s ease-out;
 }
 .modal__item{
   height: 100%;
 
   padding: 24px;
 
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-
   background: var(--background-white);
 
   position: relative;
+
+  display: none;
+}
+.modal__item.active{
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
 }
 .modal__close{
   position: absolute;