refactor: sort windi class names

packages/hoppscotch-app/components/smart/Modal.vue

@@ -2,14 +2,14 @@
   <transition name="fade" appear @leave="onTransitionLeaveStart">
     <div
       ref="modal"
-      class="inset-0 transition z-10 z-50 fixed hide-scrollbar overflow-y-auto"
+      class="fixed inset-0 z-10 z-50 overflow-y-auto hide-scrollbar transition"
     >
       <div
-        class="flex min-h-screen text-center items-end justify-center sm:block"
+        class="flex items-end justify-center min-h-screen text-center sm:block"
       >
         <transition name="fade" appear>
           <div
-            class="bg-primaryLight opacity-90 inset-0 transition fixed"
+            class="fixed inset-0 bg-primaryLight opacity-90 transition"
             @touchstart="!dialog ? close() : null"
             @touchend="!dialog ? close() : null"
             @mouseup="!dialog ? close() : null"
@@ -25,24 +25,24 @@
         <transition
           appear
           enter-active-class="transition"
-          enter-class="translate-y-4 scale-95"
-          enter-to-class="translate-y-0 scale-100"
+          enter-class="scale-95 translate-y-4"
+          enter-to-class="scale-100 translate-y-0"
           leave-active-class="transition"
-          leave-class="translate-y-0 scale-100"
-          leave-to-class="translate-y-4 scale-95"
+          leave-class="scale-100 translate-y-0"
+          leave-to-class="scale-95 translate-y-4"
         >
           <div
             class="
               bg-primary
-              shadow-lg
-              text-left
-              w-full
-              transform
-              transition-all
-              inline-block
-              align-bottom
-              overflow-hidden
               sm:align-middle sm:rounded-xl
+              inline-block
+              w-full
+              overflow-hidden
+              text-left
+              align-bottom
+              transition-all
+              transform
+              shadow-lg
             "
             :class="[
               { 'mt-24 md:mb-8': placement === 'top' },
@@ -52,7 +52,7 @@
           >
             <div
               v-if="title"
-              class="flex mb-4 pl-2 items-center justify-between"
+              class="flex items-center justify-between pl-2 mb-4"
             >
               <h3 class="heading">{{ title }}</h3>
               <span class="flex">
@@ -66,14 +66,14 @@
               </span>
             </div>
             <div
-              class="flex flex-col max-h-md overflow-y-auto hide-scrollbar"
+              class="flex flex-col overflow-y-auto max-h-md hide-scrollbar"
               :class="{ 'py-2': !fullWidth }"
             >
               <slot name="body"></slot>
             </div>
             <div
               v-if="hasFooterSlot"
-              class="flex flex-1 mt-4 p-2 items-center justify-between"
+              class="flex items-center justify-between flex-1 p-2 mt-4"
             >
               <slot name="footer"></slot>
             </div>