added animation for delete first msg in chat

luckydiamond/src/assets/css/ElementsStyles/chat.css

@@ -49,11 +49,18 @@
 }
 
 .card__user {
-    margin-top: 24px;
     margin: 24px 70px 0px 23px;
     display: flex;
 }
 
+.fade-enter-active, .fade-leave-active {
+    transition: opacity 0.5s, transform 0.5s;
+}
+.fade-enter, .fade-leave-to {
+    opacity: 0;
+    transform: translateY(20px);
+}
+
 .user__icon {
     display: flex;
     justify-content: center;

luckydiamond/src/pages/ChatElement.vue

@@ -12,6 +12,7 @@
     </div>
     <div class="chat__content--users">
       <ul>
+        <transition-group name="fade" mode="out-in">
           <li
               v-for="msg in array"
               :key="msg"
@@ -26,6 +27,7 @@
               </div>
             </div>
           </li>
+        </transition-group>
       </ul>
     </div>
     <writechat-component @send="ClaimDatamsg"></writechat-component>