refactor(ui): sort windicss classes

components/history/graphql/Card.vue

@@ -3,16 +3,17 @@
     <div class="flex items-center">
       <span
         class="
-          py-3
           cursor-pointer
+          flex
+          font-semibold
+          flex-1
+          text-xs
+          min-w-0
+          py-3
           pr-2
           pl-4
-          flex flex-1
-          min-w-0
-          text-xs
-          group-hover:text-secondaryDark
           transition
-          font-semibold
+          group-hover:text-secondaryDark
         "
         data-testid="restore_history_entry"
         @click="$emit('use-entry')"
@@ -52,12 +53,11 @@
         v-for="(line, index) in query"
         :key="`line-${index}`"
         class="
-          text-xs
           cursor-pointer
-          truncate
-          px-4
           font-mono
-          text-secondaryLight
+          text-xs text-secondaryLight
+          px-4
+          truncate
         "
         data-testid="restore_history_entry"
         @click="$emit('use-entry')"

components/history/index.vue

@@ -2,24 +2,25 @@
   <AppSection label="history">
     <div
       class="
-        flex
-        sticky
-        z-10
         bg-primaryLight
-        top-10
         border-b border-dividerLight
+        flex
+        top-10
+        z-10
+        sticky
       "
     >
       <input
         v-model="filterText"
         type="search"
         class="
-          px-4
-          py-3
-          text-xs
-          flex flex-1
-          font-medium
           bg-primaryLight
+          flex
+          font-medium
+          flex-1
+          text-xs
+          py-3
+          px-4
           focus:outline-none
         "
         :placeholder="$t('search')"
@@ -56,18 +57,18 @@
     </div>
     <div
       v-if="!(filteredHistory.length !== 0 || history.length === 0)"
-      class="flex items-center text-secondaryLight flex-col p-4 justify-center"
+      class="flex flex-col text-secondaryLight p-4 items-center justify-center"
     >
-      <i class="material-icons opacity-50 pb-2">manage_search</i>
+      <i class="opacity-50 pb-2 material-icons">manage_search</i>
       <span class="text-xs text-center">
         {{ $t("nothing_found") }} "{{ filterText }}"
       </span>
     </div>
     <div
       v-if="history.length === 0"
-      class="flex items-center text-secondaryLight flex-col p-4 justify-center"
+      class="flex flex-col text-secondaryLight p-4 items-center justify-center"
     >
-      <i class="material-icons opacity-50 pb-2">schedule</i>
+      <i class="opacity-50 pb-2 material-icons">schedule</i>
       <span class="text-xs text-center">
         {{ $t("history_empty") }}
       </span>

components/history/rest/Card.vue

@@ -2,15 +2,15 @@
   <div class="flex items-center group">
     <span
       class="
-        font-mono font-bold
+        cursor-pointer
         flex
-        justify-center
-        items-center
+        font-mono font-bold
+        mx-2
         text-xs
         w-12
-        mx-2
+        justify-center
+        items-center
         truncate
-        cursor-pointer
       "
       :class="entryStatus.className"
       data-testid="restore_history_entry"
@@ -21,15 +21,16 @@
     </span>
     <span
       class="
-        py-3
         cursor-pointer
-        pr-2
-        flex flex-1
-        min-w-0
-        text-xs
-        group-hover:text-secondaryDark
-        transition
+        flex
         font-semibold
+        flex-1
+        text-xs
+        min-w-0
+        py-3
+        pr-2
+        transition
+        group-hover:text-secondaryDark
       "
       data-testid="restore_history_entry"
       :title="duration"