fix: minor ui improvements

packages/hoppscotch-app/components/http/ResponseMeta.vue

@@ -1,5 +1,18 @@
 <template>
-  <div class="bg-primary flex p-4 top-0 z-10 sticky items-center">
+  <div
+    class="
+      bg-primary
+      flex
+      p-4
+      top-0
+      z-10
+      sticky
+      items-center
+      overflow-auto
+      hide-scrollbar
+      whitespace-nowrap
+    "
+  >
     <div
       v-if="response == null"
       class="

packages/hoppscotch-app/components/http/TestResultEntry.vue

@@ -28,7 +28,7 @@
         <span class="text-secondaryLight">
           {{
             ` \xA0 — \xA0 ${
-              result.status === "pass" ? t("test.passed") : t("test.failed")
+              result.status === "pass" ? $t("test.passed") : $t("test.failed")
             }`
           }}
         </span>
@@ -40,9 +40,6 @@
 <script setup lang="ts">
 import { PropType } from "@nuxtjs/composition-api"
 import { HoppTestResult } from "~/helpers/types/HoppTestResult"
-import { useI18n } from "~/helpers/utils/composables"
-
-const t = useI18n()
 
 defineProps({
   testResults: {

packages/hoppscotch-app/helpers/editor/themes/baseTheme.ts

@@ -94,9 +94,11 @@ export const baseTheme = EditorView.theme({
   ".cm-activeLine": { backgroundColor: "transparent" },
   ".cm-searchMatch": {
     outline: "1px solid var(--accent-dark-color)",
+    backgroundColor: "var(--divider-dark-color)",
   },
   ".cm-selectionMatch": {
     outline: "1px solid var(--accent-dark-color)",
+    backgroundColor: "var(--divider-light-color)",
   },
   ".cm-matchingBracket, .cm-nonmatchingBracket": {
     backgroundColor: "var(--divider-color)",