refactor: sort windi class names

packages/hoppscotch-app/components/app/Announcement.vue

@@ -2,25 +2,31 @@
   <div class="bg-error flex justify-between">
     <span
       class="
-        flex
-        py-2
-        px-4
-        transition
+        group
         relative
+        flex
         items-center
         justify-center
-        group
+        px-4
+        py-2
+        transition
       "
     >
-      <i class="mr-2 material-icons">info_outline</i>
+      <i class="material-icons mr-2">info_outline</i>
       <span class="text-secondaryDark">
         <span class="md:hidden">
-          {{ $t("helpers.offline_short") }}
+          {{ t("helpers.offline_short") }}
         </span>
-        <span class="hidden md:inline">
-          {{ $t("helpers.offline") }}
+        <span class="md:inline hidden">
+          {{ t("helpers.offline") }}
         </span>
       </span>
     </span>
   </div>
 </template>
+
+<script setup lang="ts">
+import { useI18n } from "~/helpers/utils/composables"
+
+const t = useI18n()
+</script>