refactor: lint + minor ui fixes

packages/hoppscotch-app/components/lenses/HeadersRenderer.vue

@@ -1,21 +1,9 @@
 <template>
   <div>
     <div
-      class="
-        bg-primary
-        border-dividerLight
-        top-lowerSecondaryStickyFold
-        sticky
-        z-10
-        flex
-        items-center
-        justify-between
-        flex-1
-        pl-4
-        border-b
-      "
+      class="bg-primary border-dividerLight top-lowerSecondaryStickyFold sticky z-10 flex items-center justify-between flex-1 pl-4 border-b"
     >
-      <label class="font-semibold text-secondaryLight">
+      <label class="text-secondaryLight font-semibold">
         {{ t("request.header_list") }}
       </label>
       <div class="flex">
@@ -32,40 +20,17 @@
     <div
       v-for="(header, index) in headers"
       :key="`header-${index}`"
-      class="
-        divide-dividerLight
-        border-dividerLight
-        group
-        flex
-        border-b
-        divide-x
-      "
+      class="divide-dividerLight border-dividerLight group flex border-b divide-x"
     >
       <span
-        class="
-          flex
-          group-hover:text-secondaryDark
-          flex-1
-          min-w-0
-          px-4
-          py-2
-          transition
-        "
+        class="group-hover:text-secondaryDark flex flex-1 min-w-0 px-4 py-2 transition"
       >
         <span class="truncate rounded-sm select-all">
           {{ header.key }}
         </span>
       </span>
       <span
-        class="
-          flex
-          group-hover:text-secondaryDark
-          flex-1
-          min-w-0
-          px-4
-          py-2
-          transition
-        "
+        class="group-hover:text-secondaryDark flex flex-1 min-w-0 px-4 py-2 transition"
       >
         <span class="truncate rounded-sm select-all">
           {{ header.value }}