diff --git a/packages/hoppscotch-app/assets/scss/styles.scss b/packages/hoppscotch-app/assets/scss/styles.scss
index da72224c..57f74006 100644
--- a/packages/hoppscotch-app/assets/scss/styles.scss
+++ b/packages/hoppscotch-app/assets/scss/styles.scss
@@ -64,10 +64,10 @@ body {
   @apply font-medium;
   @apply select-none;
   @apply overflow-x-hidden;
+  @apply text-body;
+  @apply leading-body;
 
   animation: fade 300ms forwards;
-  font-size: var(--body-font-size);
-  line-height: var(--body-line-height);
   -webkit-tap-highlight-color: transparent;
   -webkit-touch-callout: none;
 }
@@ -103,15 +103,15 @@ body {
 .material-icons {
   @apply flex-shrink-0;
 
-  font-size: var(--body-line-height) !important;
-  width: var(--body-line-height);
+  font-size: var(--line-height-body) !important;
+  width: var(--line-height-body);
 }
 
 .svg-icons {
   @apply flex-shrink-0;
 
-  height: var(--body-line-height);
-  width: var(--body-line-height);
+  height: var(--line-height-body);
+  width: var(--line-height-body);
 }
 
 a {
@@ -120,9 +120,8 @@ a {
   @apply no-underline;
   @apply outline-none;
   @apply transition;
-
-  font-size: var(--body-font-size);
-  line-height: var(--body-line-height);
+  @apply text-body;
+  @apply leading-body;
 
   &.link {
     @apply items-center;
@@ -144,9 +143,9 @@ a {
   @apply rounded;
   @apply truncate;
   @apply shadow;
+  @apply leading-body;
 
   font-size: 88%;
-  line-height: var(--body-line-height);
 
   kbd {
     @apply inline-flex;
@@ -166,11 +165,10 @@ a {
   @apply text-secondary;
   @apply p-2;
   @apply shadow-lg;
+  @apply text-body;
+  @apply leading-body;
   @apply focus:outline-none;
 
-  font-size: var(--body-font-size);
-  line-height: var(--body-line-height);
-
   .tippy-roundarrow svg {
     @apply fill-popover;
   }
@@ -216,13 +214,12 @@ input,
 select,
 textarea,
 button {
-  @apply focus:outline-none;
   @apply truncate;
   @apply transition;
+  @apply text-body;
+  @apply leading-body;
+  @apply focus:outline-none;
   @apply disabled:cursor-not-allowed;
-
-  font-size: var(--body-font-size);
-  line-height: var(--body-line-height);
 }
 
 .input[type="file"],
@@ -323,9 +320,8 @@ pre.ace_editor {
       @apply shadow;
       @apply font-medium;
       @apply transition;
-
-      font-size: var(--body-font-size);
-      line-height: var(--body-line-height);
+      @apply text-body;
+      @apply leading-body;
 
       .action {
         @apply bg-gray-500;
@@ -337,12 +333,11 @@ pre.ace_editor {
         @apply rounded;
         @apply text-current;
         @apply normal-case;
+        @apply font-medium;
+        @apply text-body;
+        @apply leading-body;
         @apply hover:bg-opacity-20;
         @apply hover:no-underline;
-        @apply font-medium;
-
-        font-size: var(--body-font-size);
-        line-height: var(--body-line-height);
       }
     }
 
@@ -451,6 +446,7 @@ pre.ace_editor {
 }
 
 .shortcut-key {
+  @apply font-sans;
   @apply bg-dividerLight;
   @apply rounded;
   @apply ml-2;
diff --git a/packages/hoppscotch-app/assets/scss/themes.scss b/packages/hoppscotch-app/assets/scss/themes.scss
index 1422e34e..5e5c0dc8 100644
--- a/packages/hoppscotch-app/assets/scss/themes.scss
+++ b/packages/hoppscotch-app/assets/scss/themes.scss
@@ -2,6 +2,7 @@
   --font-sans: "Inter", sans-serif;
   --font-mono: "Roboto Mono", monospace;
   --font-icon: "Material Icons";
+  --font-size-tiny: calc(var(--font-size-body) - 0.062rem);
 }
 
 @mixin dark-theme {
@@ -243,8 +244,8 @@
 }
 
 @mixin font-small {
-  --body-font-size: 0.75rem;
-  --body-line-height: 1rem;
+  --font-size-body: 0.75rem;
+  --line-height-body: 1rem;
   --upper-primary-sticky-fold: 4.125rem;
   --upper-secondary-sticky-fold: 6.125rem;
   --upper-tertiary-sticky-fold: 8.188rem;
@@ -255,8 +256,8 @@
 }
 
 @mixin font-medium {
-  --body-font-size: 0.875rem;
-  --body-line-height: 1.25rem;
+  --font-size-body: 0.875rem;
+  --line-height-body: 1.25rem;
   --upper-primary-sticky-fold: 4.375rem;
   --upper-secondary-sticky-fold: 6.625rem;
   --upper-tertiary-sticky-fold: 8.813rem;
@@ -267,8 +268,8 @@
 }
 
 @mixin font-large {
-  --body-font-size: 1rem;
-  --body-line-height: 1.5rem;
+  --font-size-body: 1rem;
+  --line-height-body: 1.5rem;
   --upper-primary-sticky-fold: 4.625rem;
   --upper-secondary-sticky-fold: 7.125rem;
   --upper-tertiary-sticky-fold: 9.5rem;
diff --git a/packages/hoppscotch-app/components/app/Fuse.vue b/packages/hoppscotch-app/components/app/Fuse.vue
index c46e66b6..b13c1004 100644
--- a/packages/hoppscotch-app/components/app/Fuse.vue
+++ b/packages/hoppscotch-app/components/app/Fuse.vue
@@ -14,7 +14,7 @@
       class="flex flex-col text-secondaryLight p-4 items-center justify-center"
     >
       <i class="opacity-75 pb-2 material-icons">manage_search</i>
-      <span class="text-center">
+      <span class="text-center my-2">
         {{ t("state.nothing_found") }} "{{ search }}"
       </span>
     </div>
diff --git a/packages/hoppscotch-app/components/app/PowerSearch.vue b/packages/hoppscotch-app/components/app/PowerSearch.vue
index c60325f5..8e01849a 100644
--- a/packages/hoppscotch-app/components/app/PowerSearch.vue
+++ b/packages/hoppscotch-app/components/app/PowerSearch.vue
@@ -14,8 +14,29 @@
         autocomplete="off"
         name="command"
         :placeholder="`${t('app.type_a_command_search')}`"
-        class="bg-transparent border-b border-dividerLight flex flex-shrink-0 text-base text-secondaryDark p-6"
+        class="bg-transparent flex flex-shrink-0 text-base text-secondaryDark p-6"
       />
+      <div
+        class="flex pb-4 px-4 border-b text-tiny border-dividerLight justify-between text-secondaryLight whitespace-nowrap overflow-auto flex-shrink-0 hide-scrollbar"
+      >
+        <div class="flex items-center">
+          <kbd class="shortcut-key">↑</kbd>
+          <kbd class="shortcut-key">↓</kbd>
+          <span class="truncate ml-2">
+            {{ t("action.to_navigate") }}
+          </span>
+          <kbd class="shortcut-key">↩</kbd>
+          <span class="truncate ml-2">
+            {{ t("action.to_select") }}
+          </span>
+        </div>
+        <div class="flex items-center">
+          <kbd class="shortcut-key">ESC</kbd>
+          <span class="truncate ml-2">
+            {{ t("action.to_close") }}
+          </span>
+        </div>
+      </div>
       <AppFuse
         v-if="search && show"
         :input="fuse"
diff --git a/packages/hoppscotch-app/components/app/Shortcuts.vue b/packages/hoppscotch-app/components/app/Shortcuts.vue
index d61cf453..3e07461c 100644
--- a/packages/hoppscotch-app/components/app/Shortcuts.vue
+++ b/packages/hoppscotch-app/components/app/Shortcuts.vue
@@ -43,7 +43,7 @@
           class="flex flex-col text-secondaryLight p-4 items-center justify-center"
         >
           <i class="opacity-75 pb-2 material-icons">manage_search</i>
-          <span class="text-center">
+          <span class="text-center my-2">
             {{ t("state.nothing_found") }} "{{ filterText }}"
           </span>
         </div>
diff --git a/packages/hoppscotch-app/components/app/Sidenav.vue b/packages/hoppscotch-app/components/app/Sidenav.vue
index 77fee36e..452e97d4 100644
--- a/packages/hoppscotch-app/components/app/Sidenav.vue
+++ b/packages/hoppscotch-app/components/app/Sidenav.vue
@@ -103,9 +103,8 @@ const primaryNavigation = [
 
   span {
     @apply mt-2;
-    @apply font-font-medium;
-
-    font-size: calc(var(--body-font-size) - 0.062rem);
+    @apply font-medium;
+    @apply text-tiny;
   }
 
   &.exact-active-link {
diff --git a/packages/hoppscotch-app/components/collections/graphql/Collection.vue b/packages/hoppscotch-app/components/collections/graphql/Collection.vue
index fc9f3958..44e8f69e 100644
--- a/packages/hoppscotch-app/components/collections/graphql/Collection.vue
+++ b/packages/hoppscotch-app/components/collections/graphql/Collection.vue
@@ -16,7 +16,7 @@
       >
         <SmartIcon
           class="svg-icons"
-          :class="{ 'text-green-500': isSelected }"
+          :class="{ 'text-accent': isSelected }"
           :name="getCollectionIcon"
         />
       </span>
@@ -24,7 +24,9 @@
         class="cursor-pointer flex flex-1 min-w-0 py-2 pr-2 transition group-hover:text-secondaryDark"
         @click="toggleShowChildren()"
       >
-        <span class="truncate"> {{ collection.name }} </span>
+        <span class="truncate" :class="{ 'text-accent': isSelected }">
+          {{ collection.name }}
+        </span>
       </span>
       <div class="flex">
         <ButtonSecondary
diff --git a/packages/hoppscotch-app/components/collections/graphql/Folder.vue b/packages/hoppscotch-app/components/collections/graphql/Folder.vue
index 563f1e41..2d0199bd 100644
--- a/packages/hoppscotch-app/components/collections/graphql/Folder.vue
+++ b/packages/hoppscotch-app/components/collections/graphql/Folder.vue
@@ -16,7 +16,7 @@
       >
         <SmartIcon
           class="svg-icons"
-          :class="{ 'text-green-500': isSelected }"
+          :class="{ 'text-accent': isSelected }"
           :name="getCollectionIcon"
         />
       </span>
@@ -24,7 +24,7 @@
         class="cursor-pointer flex flex-1 min-w-0 py-2 pr-2 transition group-hover:text-secondaryDark"
         @click="toggleShowChildren()"
       >
-        <span class="truncate">
+        <span class="truncate" :class="{ 'text-accent': isSelected }">
           {{ folder.name ? folder.name : folder.title }}
         </span>
       </span>
diff --git a/packages/hoppscotch-app/components/collections/graphql/Request.vue b/packages/hoppscotch-app/components/collections/graphql/Request.vue
index eae3f787..3ef1b9b2 100644
--- a/packages/hoppscotch-app/components/collections/graphql/Request.vue
+++ b/packages/hoppscotch-app/components/collections/graphql/Request.vue
@@ -15,7 +15,7 @@
       >
         <SmartIcon
           class="svg-icons"
-          :class="{ 'text-green-500': isSelected }"
+          :class="{ 'text-accent': isSelected }"
           :name="isSelected ? 'check-circle' : 'file'"
         />
       </span>
@@ -23,7 +23,9 @@
         class="cursor-pointer flex flex-1 min-w-0 py-2 pr-2 transition group-hover:text-secondaryDark"
         @click="!doc ? selectRequest() : {}"
       >
-        <span class="truncate"> {{ request.name }} </span>
+        <span class="truncate" :class="{ 'text-accent': isSelected }">
+          {{ request.name }}
+        </span>
       </span>
       <div class="flex">
         <ButtonSecondary
diff --git a/packages/hoppscotch-app/components/collections/graphql/index.vue b/packages/hoppscotch-app/components/collections/graphql/index.vue
index 786ddfe2..17b69cab 100644
--- a/packages/hoppscotch-app/components/collections/graphql/index.vue
+++ b/packages/hoppscotch-app/components/collections/graphql/index.vue
@@ -84,7 +84,7 @@
       class="flex flex-col text-secondaryLight p-4 items-center justify-center"
     >
       <i class="opacity-75 pb-2 material-icons">manage_search</i>
-      <span class="text-center">
+      <span class="text-center my-2">
         {{ $t("state.nothing_found") }} "{{ filterText }}"
       </span>
     </div>
diff --git a/packages/hoppscotch-app/components/collections/index.vue b/packages/hoppscotch-app/components/collections/index.vue
index ddf76cf6..4b2ece92 100644
--- a/packages/hoppscotch-app/components/collections/index.vue
+++ b/packages/hoppscotch-app/components/collections/index.vue
@@ -5,7 +5,7 @@
   >
     <div
       class="divide-dividerLight divide-y bg-primary border-b border-dividerLight rounded-t flex flex-col z-10 sticky"
-      :style="saveRequest ? 'top: calc(-1 * var(--body-font-size))' : 'top: 0'"
+      :style="saveRequest ? 'top: calc(-1 * var(--font-size-body))' : 'top: 0'"
     >
       <div v-if="!saveRequest" class="search-wrappe">
         <input
@@ -135,7 +135,7 @@
       class="flex flex-col text-secondaryLight p-4 items-center justify-center"
     >
       <i class="opacity-75 pb-2 material-icons">manage_search</i>
-      <span class="text-center">
+      <span class="text-center my-2">
         {{ $t("state.nothing_found") }} "{{ filterText }}"
       </span>
     </div>
diff --git a/packages/hoppscotch-app/components/collections/my/Collection.vue b/packages/hoppscotch-app/components/collections/my/Collection.vue
index 01a92ce8..9a651b66 100644
--- a/packages/hoppscotch-app/components/collections/my/Collection.vue
+++ b/packages/hoppscotch-app/components/collections/my/Collection.vue
@@ -16,7 +16,7 @@
       >
         <SmartIcon
           class="svg-icons"
-          :class="{ 'text-green-500': isSelected }"
+          :class="{ 'text-accent': isSelected }"
           :name="getCollectionIcon"
         />
       </span>
@@ -24,7 +24,9 @@
         class="cursor-pointer flex flex-1 min-w-0 py-2 pr-2 transition group-hover:text-secondaryDark"
         @click="toggleShowChildren()"
       >
-        <span class="truncate"> {{ collection.name }} </span>
+        <span class="truncate" :class="{ 'text-accent': isSelected }">
+          {{ collection.name }}
+        </span>
       </span>
       <div class="flex">
         <ButtonSecondary
diff --git a/packages/hoppscotch-app/components/collections/my/Folder.vue b/packages/hoppscotch-app/components/collections/my/Folder.vue
index 50be0715..395468a7 100644
--- a/packages/hoppscotch-app/components/collections/my/Folder.vue
+++ b/packages/hoppscotch-app/components/collections/my/Folder.vue
@@ -16,7 +16,7 @@
       >
         <SmartIcon
           class="svg-icons"
-          :class="{ 'text-green-500': isSelected }"
+          :class="{ 'text-accent': isSelected }"
           :name="getCollectionIcon"
         />
       </span>
@@ -24,7 +24,7 @@
         class="cursor-pointer flex flex-1 min-w-0 py-2 pr-2 transition group-hover:text-secondaryDark"
         @click="toggleShowChildren()"
       >
-        <span class="truncate">
+        <span class="truncate" :class="{ 'text-accent': isSelected }">
           {{ folder.name ? folder.name : folder.title }}
         </span>
       </span>
diff --git a/packages/hoppscotch-app/components/collections/my/Request.vue b/packages/hoppscotch-app/components/collections/my/Request.vue
index 412d5a5b..676aca73 100644
--- a/packages/hoppscotch-app/components/collections/my/Request.vue
+++ b/packages/hoppscotch-app/components/collections/my/Request.vue
@@ -17,7 +17,7 @@
         <SmartIcon
           v-if="isSelected"
           class="svg-icons"
-          :class="{ 'text-green-500': isSelected }"
+          :class="{ 'text-accent': isSelected }"
           name="check-circle"
         />
         <span v-else class="truncate">
@@ -28,7 +28,9 @@
         class="cursor-pointer flex flex-1 min-w-0 py-2 pr-2 transition items-center group-hover:text-secondaryDark"
         @click="!doc ? selectRequest() : {}"
       >
-        <span class="truncate"> {{ request.name }} </span>
+        <span class="truncate" :class="{ 'text-accent': isSelected }">
+          {{ request.name }}
+        </span>
         <span
           v-if="
             active &&
diff --git a/packages/hoppscotch-app/components/collections/teams/Collection.vue b/packages/hoppscotch-app/components/collections/teams/Collection.vue
index 32f9f8f9..7e64a928 100644
--- a/packages/hoppscotch-app/components/collections/teams/Collection.vue
+++ b/packages/hoppscotch-app/components/collections/teams/Collection.vue
@@ -10,7 +10,7 @@
       >
         <SmartIcon
           class="svg-icons"
-          :class="{ 'text-green-500': isSelected }"
+          :class="{ 'text-accent': isSelected }"
           :name="getCollectionIcon"
         />
       </span>
@@ -18,7 +18,9 @@
         class="cursor-pointer flex flex-1 min-w-0 py-2 pr-2 transition group-hover:text-secondaryDark"
         @click="toggleShowChildren()"
       >
-        <span class="truncate"> {{ collection.title }} </span>
+        <span class="truncate" :class="{ 'text-accent': isSelected }">
+          {{ collection.title }}
+        </span>
       </span>
       <div class="flex">
         <ButtonSecondary
diff --git a/packages/hoppscotch-app/components/collections/teams/Folder.vue b/packages/hoppscotch-app/components/collections/teams/Folder.vue
index 252cad5a..3e5ba732 100644
--- a/packages/hoppscotch-app/components/collections/teams/Folder.vue
+++ b/packages/hoppscotch-app/components/collections/teams/Folder.vue
@@ -10,7 +10,7 @@
       >
         <SmartIcon
           class="svg-icons"
-          :class="{ 'text-green-500': isSelected }"
+          :class="{ 'text-accent': isSelected }"
           :name="getCollectionIcon"
         />
       </span>
@@ -18,7 +18,7 @@
         class="cursor-pointer flex flex-1 min-w-0 py-2 pr-2 transition group-hover:text-secondaryDark"
         @click="toggleShowChildren()"
       >
-        <span class="truncate">
+        <span class="truncate" :class="{ 'text-accent': isSelected }">
           {{ folder.name ? folder.name : folder.title }}
         </span>
       </span>
diff --git a/packages/hoppscotch-app/components/collections/teams/Request.vue b/packages/hoppscotch-app/components/collections/teams/Request.vue
index 185d3e3a..ce4aff22 100644
--- a/packages/hoppscotch-app/components/collections/teams/Request.vue
+++ b/packages/hoppscotch-app/components/collections/teams/Request.vue
@@ -12,10 +12,10 @@
         <SmartIcon
           v-if="isSelected"
           class="svg-icons"
-          :class="{ 'text-green-500': isSelected }"
+          :class="{ 'text-accent': isSelected }"
           name="check-circle"
         />
-        <span v-else>
+        <span v-else class="truncate">
           {{ request.method }}
         </span>
       </span>
@@ -23,7 +23,9 @@
         class="cursor-pointer flex flex-1 min-w-0 py-2 pr-2 transition items-center group-hover:text-secondaryDark"
         @click="!doc ? selectRequest() : {}"
       >
-        <span class="truncate"> {{ request.name }} </span>
+        <span class="truncate" :class="{ 'text-accent': isSelected }">
+          {{ request.name }}
+        </span>
         <span
           v-if="
             active &&
diff --git a/packages/hoppscotch-app/components/graphql/RequestOptions.vue b/packages/hoppscotch-app/components/graphql/RequestOptions.vue
index 1787465e..9438680a 100644
--- a/packages/hoppscotch-app/components/graphql/RequestOptions.vue
+++ b/packages/hoppscotch-app/components/graphql/RequestOptions.vue
@@ -1,7 +1,12 @@
 <template>
   <div>
     <SmartTabs styles="sticky bg-primary top-upperPrimaryStickyFold z-10">
-      <SmartTab :id="'query'" :label="`${t('tab.query')}`" :selected="true">
+      <SmartTab
+        :id="'query'"
+        :label="`${t('tab.query')}`"
+        :selected="true"
+        :indicator="gqlQueryString.length > 0"
+      >
         <AppSection label="query">
           <div
             class="bg-primary border-b border-dividerLight flex flex-1 top-upperSecondaryStickyFold pl-4 z-10 sticky items-center justify-between gqlRunQuery"
@@ -30,6 +35,12 @@
                 :title="t('app.wiki')"
                 svg="help-circle"
               />
+              <ButtonSecondary
+                v-tippy="{ theme: 'tooltip' }"
+                :title="t('action.clear_all')"
+                svg="trash-2"
+                @click.native="clearGQLQuery()"
+              />
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
                 :title="t('action.prettify')"
@@ -48,7 +59,11 @@
         </AppSection>
       </SmartTab>
 
-      <SmartTab :id="'variables'" :label="`${t('tab.variables')}`">
+      <SmartTab
+        :id="'variables'"
+        :label="`${t('tab.variables')}`"
+        :indicator="variableString.length > 0"
+      >
         <AppSection label="variables">
           <div
             class="bg-primary border-b border-dividerLight flex flex-1 top-upperSecondaryStickyFold pl-4 z-10 sticky items-center justify-between"
@@ -64,6 +79,12 @@
                 :title="t('app.wiki')"
                 svg="help-circle"
               />
+              <ButtonSecondary
+                v-tippy="{ theme: 'tooltip' }"
+                :title="t('action.clear_all')"
+                svg="trash-2"
+                @click.native="clearGQLVariables()"
+              />
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
                 :title="t('action.copy')"
@@ -76,7 +97,11 @@
         </AppSection>
       </SmartTab>
 
-      <SmartTab :id="'headers'" :label="`${t('tab.headers')}`">
+      <SmartTab
+        :id="'headers'"
+        :label="`${t('tab.headers')}`"
+        :info="activeGQLHeadersCount === 0 ? null : `${activeGQLHeadersCount}`"
+      >
         <AppSection label="headers">
           <div
             class="bg-primary border-b border-dividerLight flex flex-1 top-upperSecondaryStickyFold pl-4 z-10 sticky items-center justify-between"
@@ -96,7 +121,7 @@
                 v-tippy="{ theme: 'tooltip' }"
                 :title="t('action.clear_all')"
                 svg="trash-2"
-                @click.native="clearContent()"
+                @click.native="clearHeaders()"
               />
               <ButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"
@@ -230,7 +255,7 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, ref, watch } from "@nuxtjs/composition-api"
+import { computed, onMounted, ref, watch } from "@nuxtjs/composition-api"
 import clone from "lodash/clone"
 import * as gql from "graphql"
 import { GQLHeader, makeGQLRequest } from "@hoppscotch/data"
@@ -310,6 +335,12 @@ useCodemirror(bulkEditor, bulkHeaders, {
   environmentHighlights: false,
 })
 
+const activeGQLHeadersCount = computed(
+  () =>
+    headers.value.filter((x) => x.active && (x.key !== "" || x.value !== ""))
+      .length
+)
+
 const variableEditor = ref<any | null>(null)
 
 useCodemirror(variableEditor, variableString, {
@@ -507,8 +538,16 @@ const removeRequestHeader = (index: number) => {
   }
 }
 
-const clearContent = () => {
+const clearHeaders = () => {
   headers.value = []
   clearBulkEditor()
 }
+
+const clearGQLQuery = () => {
+  gqlQueryString.value = ""
+}
+
+const clearGQLVariables = () => {
+  variableString.value = ""
+}
 </script>
diff --git a/packages/hoppscotch-app/components/history/graphql/Card.vue b/packages/hoppscotch-app/components/history/graphql/Card.vue
index 90327494..b7b35847 100644
--- a/packages/hoppscotch-app/components/history/graphql/Card.vue
+++ b/packages/hoppscotch-app/components/history/graphql/Card.vue
@@ -36,7 +36,7 @@
         @click.native="$emit('toggle-star')"
       />
     </div>
-    <div class="flex flex-col">
+    <div class="flex flex-col text-tiny">
       <span
         v-for="(line, index) in query"
         :key="`line-${index}`"
diff --git a/packages/hoppscotch-app/components/history/index.vue b/packages/hoppscotch-app/components/history/index.vue
index da64752e..4f3ff3bf 100644
--- a/packages/hoppscotch-app/components/history/index.vue
+++ b/packages/hoppscotch-app/components/history/index.vue
@@ -52,7 +52,7 @@
       class="flex flex-col text-secondaryLight p-4 items-center justify-center"
     >
       <i class="opacity-75 pb-2 material-icons">manage_search</i>
-      <span class="text-center">
+      <span class="text-center my-2">
         {{ $t("state.nothing_found") }} "{{ filterText }}"
       </span>
     </div>
diff --git a/packages/hoppscotch-app/components/tab/Secondary.vue b/packages/hoppscotch-app/components/tab/Secondary.vue
index 7e43a872..85505bcc 100644
--- a/packages/hoppscotch-app/components/tab/Secondary.vue
+++ b/packages/hoppscotch-app/components/tab/Secondary.vue
@@ -3,9 +3,9 @@
     :to="`${/^\/(?!\/).*$/.test(to) ? localePath(to) : to}`"
     :exact="exact"
     :blank="blank"
-    class="font-semibold flex-1 py-2 transform transition inline-flex items-center truncate hover:translate-x-2 focus:outline-none focus-visible:translate-x-2"
+    class="font-semibold py-2 transform transition inline-flex items-center hover:translate-x-2 focus:outline-none focus-visible:translate-x-2"
     :class="[
-      label ? 'px-3' : 'px-2',
+      label ? 'px-4' : 'px-2',
       active
         ? color
           ? `text-${color}-500 hover:text-${color}-600 focus-visible:text-${color}-600`
@@ -32,7 +32,9 @@
       :class="label ? 'mr-4 opacity-75' : ''"
       class="svg-icons"
     />
-    {{ label }}
+    <span class="truncate">
+      {{ label }}
+    </span>
   </SmartLink>
 </template>
 
diff --git a/packages/hoppscotch-app/helpers/editor/themes/baseTheme.ts b/packages/hoppscotch-app/helpers/editor/themes/baseTheme.ts
index ebb0cdb4..7aa9fc11 100644
--- a/packages/hoppscotch-app/helpers/editor/themes/baseTheme.ts
+++ b/packages/hoppscotch-app/helpers/editor/themes/baseTheme.ts
@@ -30,7 +30,7 @@ import { lintKeymap } from "@codemirror/lint"
 
 export const baseTheme = EditorView.theme({
   "&": {
-    fontSize: "var(--body-font-size)",
+    fontSize: "var(--font-size-body)",
   },
   ".cm-content": {
     caretColor: "var(--secondary-light-color)",
diff --git a/packages/hoppscotch-app/helpers/shortcuts.js b/packages/hoppscotch-app/helpers/shortcuts.js
index 2a41c95c..706fb435 100644
--- a/packages/hoppscotch-app/helpers/shortcuts.js
+++ b/packages/hoppscotch-app/helpers/shortcuts.js
@@ -17,7 +17,7 @@ export default [
         label: "shortcut.general.show_all",
       },
       {
-        keys: ["Esc"],
+        keys: ["ESC"],
         label: "shortcut.general.close_current_menu",
       },
     ],
diff --git a/packages/hoppscotch-app/locales/af.json b/packages/hoppscotch-app/locales/af.json
index 54faa7be..66cea0be 100644
--- a/packages/hoppscotch-app/locales/af.json
+++ b/packages/hoppscotch-app/locales/af.json
@@ -29,6 +29,9 @@
     "send": "Stuur",
     "start": "Begin",
     "stop": "Stop",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Skakel af",
     "turn_on": "Sit aan",
     "undo": "Ontdoen",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Bepalings en privaatheid",
     "twitter": "Twitter",
     "type_a_command_search": "Tik 'n opdrag of soek ...",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Ons gebruik koekies",
     "whats_new": "Wat's nuut?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/ar.json b/packages/hoppscotch-app/locales/ar.json
index 3e2b628e..7fbe1b7d 100644
--- a/packages/hoppscotch-app/locales/ar.json
+++ b/packages/hoppscotch-app/locales/ar.json
@@ -29,6 +29,9 @@
     "send": "يرسل",
     "start": "يبدأ",
     "stop": "قف",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "اطفئه",
     "turn_on": "شغله",
     "undo": "الغاء التحميل",
diff --git a/packages/hoppscotch-app/locales/ca.json b/packages/hoppscotch-app/locales/ca.json
index 17830ed1..bf7edada 100644
--- a/packages/hoppscotch-app/locales/ca.json
+++ b/packages/hoppscotch-app/locales/ca.json
@@ -29,6 +29,9 @@
     "send": "Envia",
     "start": "Començar",
     "stop": "Atura",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Tanca",
     "turn_on": "Encendre",
     "undo": "Desfés",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Condicions i privadesa",
     "twitter": "Twitter",
     "type_a_command_search": "Escriviu una ordre o cerqueu ...",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Utilitzem cookies",
     "whats_new": "Que hi ha de nou?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/cn.json b/packages/hoppscotch-app/locales/cn.json
index cbbb6114..110a040b 100644
--- a/packages/hoppscotch-app/locales/cn.json
+++ b/packages/hoppscotch-app/locales/cn.json
@@ -29,6 +29,9 @@
     "send": "发送",
     "start": "开始",
     "stop": "停止",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "关闭",
     "turn_on": "开启",
     "undo": "撤消",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "隐私条款",
     "twitter": "Twitter",
     "type_a_command_search": "输入命令或搜索内容……",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "我们使用 cookies",
     "whats_new": "新增内容",
     "wiki": "帮助"
diff --git a/packages/hoppscotch-app/locales/cs.json b/packages/hoppscotch-app/locales/cs.json
index 2324442e..c0424d9c 100644
--- a/packages/hoppscotch-app/locales/cs.json
+++ b/packages/hoppscotch-app/locales/cs.json
@@ -29,6 +29,9 @@
     "send": "Poslat",
     "start": "Start",
     "stop": "Stop",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Vypnout",
     "turn_on": "Zapnout",
     "undo": "vrátit",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Podmínky a soukromí",
     "twitter": "Cvrlikání",
     "type_a_command_search": "Zadejte příkaz nebo hledejte…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Používáme cookies",
     "whats_new": "Co je nového?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/da.json b/packages/hoppscotch-app/locales/da.json
index 0d6b02c2..52ac63f1 100644
--- a/packages/hoppscotch-app/locales/da.json
+++ b/packages/hoppscotch-app/locales/da.json
@@ -29,6 +29,9 @@
     "send": "Sende",
     "start": "Start",
     "stop": "Hold op",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Sluk",
     "turn_on": "Tænde for",
     "undo": "Fortryd",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Vilkår og fortrolighed",
     "twitter": "Twitter",
     "type_a_command_search": "Skriv en kommando eller søg ...",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Vi bruger cookies",
     "whats_new": "Hvad er nyt?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/de.json b/packages/hoppscotch-app/locales/de.json
index a5f48948..eb63b3c4 100644
--- a/packages/hoppscotch-app/locales/de.json
+++ b/packages/hoppscotch-app/locales/de.json
@@ -29,6 +29,9 @@
     "send": "Senden",
     "start": "Start",
     "stop": "Stopp",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Ausschalten",
     "turn_on": "Einschalten",
     "undo": "Rückgängig machen",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Allgemeine Geschäftsbedingungen und Datenschutzerklärung",
     "twitter": "Twitter",
     "type_a_command_search": "Geben Sie einen Befehl ein oder suchen Sie…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Wir verwenden Cookies",
     "whats_new": "Was gibt's Neues?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/el.json b/packages/hoppscotch-app/locales/el.json
index 16e275a6..cffe25ed 100644
--- a/packages/hoppscotch-app/locales/el.json
+++ b/packages/hoppscotch-app/locales/el.json
@@ -29,6 +29,9 @@
     "send": "Στείλετε",
     "start": "Αρχή",
     "stop": "Να σταματήσει",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Σβήνω",
     "turn_on": "Ανάβω",
     "undo": "Ξεκάνω",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Όροι και απόρρητο",
     "twitter": "Κελάδημα",
     "type_a_command_search": "Πληκτρολογήστε μια εντολή ή αναζήτηση…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Χρησιμοποιούμε cookies",
     "whats_new": "Τι νέα?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/en.json b/packages/hoppscotch-app/locales/en.json
index 2927bf23..979f021e 100644
--- a/packages/hoppscotch-app/locales/en.json
+++ b/packages/hoppscotch-app/locales/en.json
@@ -29,6 +29,9 @@
     "send": "Send",
     "start": "Start",
     "stop": "Stop",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Turn off",
     "turn_on": "Turn on",
     "undo": "Undo",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Terms and privacy",
     "twitter": "Twitter",
     "type_a_command_search": "Type a command or search…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "We use cookies",
     "whats_new": "What's new?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/es.json b/packages/hoppscotch-app/locales/es.json
index 5c68e8ec..884cadc3 100644
--- a/packages/hoppscotch-app/locales/es.json
+++ b/packages/hoppscotch-app/locales/es.json
@@ -29,6 +29,9 @@
     "send": "Enviar",
     "start": "Empezar",
     "stop": "Detener",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Desactivar",
     "turn_on": "Activar",
     "undo": "Deshacer",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Términos y privacidad",
     "twitter": "Twitter",
     "type_a_command_search": "Escribe un comando o busca…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Usamos cookies",
     "whats_new": "¿Qué hay de nuevo?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/fi.json b/packages/hoppscotch-app/locales/fi.json
index 8036079c..0bf3f04e 100644
--- a/packages/hoppscotch-app/locales/fi.json
+++ b/packages/hoppscotch-app/locales/fi.json
@@ -29,6 +29,9 @@
     "send": "Lähettää",
     "start": "alkaa",
     "stop": "Lopettaa",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Sammuttaa",
     "turn_on": "Kiihottua",
     "undo": "Kumoa",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Ehdot ja yksityisyys",
     "twitter": "Viserrys",
     "type_a_command_search": "Kirjoita komento tai hae…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Käytämme evästeitä",
     "whats_new": "Mikä on uutta?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/fr.json b/packages/hoppscotch-app/locales/fr.json
index 558b5775..32138c0f 100644
--- a/packages/hoppscotch-app/locales/fr.json
+++ b/packages/hoppscotch-app/locales/fr.json
@@ -29,6 +29,9 @@
     "send": "Envoyer",
     "start": "Démarrer",
     "stop": "Arrêter",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Éteindre",
     "turn_on": "Allumer",
     "undo": "Annuler",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Conditions et confidentialité",
     "twitter": "Twitter",
     "type_a_command_search": "Tapez une commande ou recherchez…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Nous utilisons des cookies",
     "whats_new": "Quoi de neuf?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/he.json b/packages/hoppscotch-app/locales/he.json
index 9c702ce3..190240a3 100644
--- a/packages/hoppscotch-app/locales/he.json
+++ b/packages/hoppscotch-app/locales/he.json
@@ -29,6 +29,9 @@
     "send": "לִשְׁלוֹחַ",
     "start": "הַתחָלָה",
     "stop": "תפסיק",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "לכבות",
     "turn_on": "להדליק",
     "undo": "לבטל",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "תנאים ופרטיות",
     "twitter": "טוויטר",
     "type_a_command_search": "הקלד פקודה או חפש ...",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "אנו משתמשים בעוגיות",
     "whats_new": "מה חדש?",
     "wiki": "ויקי"
diff --git a/packages/hoppscotch-app/locales/hu.json b/packages/hoppscotch-app/locales/hu.json
index e9f7d215..a49c3f5b 100644
--- a/packages/hoppscotch-app/locales/hu.json
+++ b/packages/hoppscotch-app/locales/hu.json
@@ -29,6 +29,9 @@
     "send": "Küld",
     "start": "Rajt",
     "stop": "Álljon meg",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Kikapcsolni",
     "turn_on": "Bekapcsol",
     "undo": "Visszavonás",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Feltételek és adatvédelem",
     "twitter": "Twitter",
     "type_a_command_search": "Írjon be parancsot vagy keresést…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Sütiket használunk",
     "whats_new": "Mi újság?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/it.json b/packages/hoppscotch-app/locales/it.json
index c422ce6b..3d83d0e1 100644
--- a/packages/hoppscotch-app/locales/it.json
+++ b/packages/hoppscotch-app/locales/it.json
@@ -29,6 +29,9 @@
     "send": "Invia",
     "start": "Avvia",
     "stop": "Interrompi",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Spegni",
     "turn_on": "Accendi",
     "undo": "Annulla",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Termini e privacy",
     "twitter": "Twitter",
     "type_a_command_search": "Digita un comando o cerca...",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Utilizziamo i cookie",
     "whats_new": "Cosa c'è di nuovo?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/ja.json b/packages/hoppscotch-app/locales/ja.json
index be3f4c76..6aa06962 100644
--- a/packages/hoppscotch-app/locales/ja.json
+++ b/packages/hoppscotch-app/locales/ja.json
@@ -29,6 +29,9 @@
     "send": "送信",
     "start": "始める",
     "stop": "ストップ",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "消す",
     "turn_on": "オンにする",
     "undo": "元に戻す",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "利用規約とプライバシー",
     "twitter": "ツイッター",
     "type_a_command_search": "コマンドを入力するか、検索してください…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "クッキーを使用しています",
     "whats_new": "新着情報？",
     "wiki": "ウィキ"
diff --git a/packages/hoppscotch-app/locales/ko.json b/packages/hoppscotch-app/locales/ko.json
index f3e4ff19..c5722b06 100644
--- a/packages/hoppscotch-app/locales/ko.json
+++ b/packages/hoppscotch-app/locales/ko.json
@@ -29,6 +29,9 @@
     "send": "보내기",
     "start": "시작",
     "stop": "정지",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "끄기",
     "turn_on": "켜기",
     "undo": "실행 취소",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "약관 및 개인정보 보호",
     "twitter": "트위터",
     "type_a_command_search": "명령을 입력하거나 검색...",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "우리는 쿠키를 사용중입니다",
     "whats_new": "새로운 소식?",
     "wiki": "위키"
diff --git a/packages/hoppscotch-app/locales/nl.json b/packages/hoppscotch-app/locales/nl.json
index 052a9cd2..cdbe2909 100644
--- a/packages/hoppscotch-app/locales/nl.json
+++ b/packages/hoppscotch-app/locales/nl.json
@@ -29,6 +29,9 @@
     "send": "Versturen",
     "start": "Begin",
     "stop": "Stop",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Uitschakelen",
     "turn_on": "Inschakelen",
     "undo": "Ongedaan maken",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Voorwaarden en privacy",
     "twitter": "Twitter",
     "type_a_command_search": "Typ een opdracht of zoek...",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Wij gebruiken cookies",
     "whats_new": "Wat is er nieuw?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/no.json b/packages/hoppscotch-app/locales/no.json
index 9111a252..04583611 100644
--- a/packages/hoppscotch-app/locales/no.json
+++ b/packages/hoppscotch-app/locales/no.json
@@ -29,6 +29,9 @@
     "send": "Sende",
     "start": "Start",
     "stop": "Stoppe",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Skru av",
     "turn_on": "Slå på",
     "undo": "Angre",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Vilkår og personvern",
     "twitter": "Twitter",
     "type_a_command_search": "Skriv inn en kommando eller søk ...",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Vi bruker informasjonskapsler",
     "whats_new": "Hva er nytt?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/pl.json b/packages/hoppscotch-app/locales/pl.json
index 8cdd8022..0ee18376 100644
--- a/packages/hoppscotch-app/locales/pl.json
+++ b/packages/hoppscotch-app/locales/pl.json
@@ -29,6 +29,9 @@
     "send": "Wyślij",
     "start": "Rozpocznij",
     "stop": "Zatrzymaj",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Wyłącz",
     "turn_on": "Włącz",
     "undo": "Cofnij",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Warunki i prywatność",
     "twitter": "Twitter",
     "type_a_command_search": "Wpisz polecenie lub wyszukaj…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Używamy plików cookie",
     "whats_new": "Co nowego?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/pt-br.json b/packages/hoppscotch-app/locales/pt-br.json
index 56e3fea2..1fe53ff7 100644
--- a/packages/hoppscotch-app/locales/pt-br.json
+++ b/packages/hoppscotch-app/locales/pt-br.json
@@ -29,6 +29,9 @@
     "send": "Mandar",
     "start": "Começar",
     "stop": "Pare",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Desligar",
     "turn_on": "Ligar",
     "undo": "Desfazer",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Termos e privacidade",
     "twitter": "Twitter",
     "type_a_command_search": "Digite um comando ou pesquise ...",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Usamos cookies",
     "whats_new": "O que há de novo?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/pt.json b/packages/hoppscotch-app/locales/pt.json
index 56e3fea2..1fe53ff7 100644
--- a/packages/hoppscotch-app/locales/pt.json
+++ b/packages/hoppscotch-app/locales/pt.json
@@ -29,6 +29,9 @@
     "send": "Mandar",
     "start": "Começar",
     "stop": "Pare",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Desligar",
     "turn_on": "Ligar",
     "undo": "Desfazer",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Termos e privacidade",
     "twitter": "Twitter",
     "type_a_command_search": "Digite um comando ou pesquise ...",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Usamos cookies",
     "whats_new": "O que há de novo?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/ro.json b/packages/hoppscotch-app/locales/ro.json
index eaf12bdb..5132fd73 100644
--- a/packages/hoppscotch-app/locales/ro.json
+++ b/packages/hoppscotch-app/locales/ro.json
@@ -29,6 +29,9 @@
     "send": "Trimite",
     "start": "start",
     "stop": "Stop",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Opriți",
     "turn_on": "Aprinde",
     "undo": "Anula",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Termeni și confidențialitate",
     "twitter": "Stare de nervozitate",
     "type_a_command_search": "Tastați o comandă sau căutați ...",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Folosim cookie-uri",
     "whats_new": "Ce mai e nou?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/ru.json b/packages/hoppscotch-app/locales/ru.json
index e989245b..b2476726 100644
--- a/packages/hoppscotch-app/locales/ru.json
+++ b/packages/hoppscotch-app/locales/ru.json
@@ -29,6 +29,9 @@
     "send": "Отправить",
     "start": "Начать",
     "stop": "Стоп",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Выключить",
     "turn_on": "Включить",
     "undo": "Отменить",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Условия и конфиденциальность",
     "twitter": "Твиттер",
     "type_a_command_search": "Введите команду или выполните поиск…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Мы используем куки",
     "whats_new": "Что нового?",
     "wiki": "Вики"
diff --git a/packages/hoppscotch-app/locales/sr.json b/packages/hoppscotch-app/locales/sr.json
index c8d0bc22..ee31af47 100644
--- a/packages/hoppscotch-app/locales/sr.json
+++ b/packages/hoppscotch-app/locales/sr.json
@@ -29,6 +29,9 @@
     "send": "Пошаљи",
     "start": "Почетак",
     "stop": "Зауставити",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Искључити",
     "turn_on": "Укључити",
     "undo": "Поништи",
diff --git a/packages/hoppscotch-app/locales/sv.json b/packages/hoppscotch-app/locales/sv.json
index 7e47aa9f..7492c56c 100644
--- a/packages/hoppscotch-app/locales/sv.json
+++ b/packages/hoppscotch-app/locales/sv.json
@@ -29,6 +29,9 @@
     "send": "Skicka",
     "start": "Start",
     "stop": "Sluta",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Stäng av",
     "turn_on": "Sätta på",
     "undo": "Ångra",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Villkor och sekretess",
     "twitter": "Twitter",
     "type_a_command_search": "Skriv ett kommando eller sök ...",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Vi använder cookies",
     "whats_new": "Vad är nytt?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/tr.json b/packages/hoppscotch-app/locales/tr.json
index 4b80ad96..e2cfe094 100644
--- a/packages/hoppscotch-app/locales/tr.json
+++ b/packages/hoppscotch-app/locales/tr.json
@@ -29,6 +29,9 @@
     "send": "Gönder",
     "start": "Başla",
     "stop": "Dur",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Kapat",
     "turn_on": "Aç",
     "undo": "Geri al",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Şartlar ve gizlilik",
     "twitter": "heyecan",
     "type_a_command_search": "Bir komut yazın veya arayın…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "çerez kullanıyoruz",
     "whats_new": "Ne var ne yok?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/locales/tw.json b/packages/hoppscotch-app/locales/tw.json
index 1f38aa90..538adb04 100644
--- a/packages/hoppscotch-app/locales/tw.json
+++ b/packages/hoppscotch-app/locales/tw.json
@@ -29,6 +29,9 @@
     "send": "傳送",
     "start": "開始",
     "stop": "停止",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "關閉",
     "turn_on": "開啟",
     "undo": "復原",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "隱私條款",
     "twitter": "Twitter",
     "type_a_command_search": "輸入命令或搜尋內容……",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "我們使用 cookies",
     "whats_new": "新增內容",
     "wiki": "幫助"
diff --git a/packages/hoppscotch-app/locales/uk.json b/packages/hoppscotch-app/locales/uk.json
index 169e9dfa..054c73de 100644
--- a/packages/hoppscotch-app/locales/uk.json
+++ b/packages/hoppscotch-app/locales/uk.json
@@ -29,6 +29,9 @@
     "send": "Надіслати",
     "start": "Почати",
     "stop": "Стій",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Вимкнути",
     "turn_on": "Ввімкнути",
     "undo": "Скасувати",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Умови та конфіденційність",
     "twitter": "Twitter",
     "type_a_command_search": "Введіть команду або виконайте пошук…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Ми використовуємо файли cookie",
     "whats_new": "Що нового?",
     "wiki": "Вікі"
diff --git a/packages/hoppscotch-app/locales/vi.json b/packages/hoppscotch-app/locales/vi.json
index efe9a66f..3ad85803 100644
--- a/packages/hoppscotch-app/locales/vi.json
+++ b/packages/hoppscotch-app/locales/vi.json
@@ -29,6 +29,9 @@
     "send": "Gửi",
     "start": "Bắt đầu",
     "stop": "Ngừng lại",
+    "to_navigate": "to navigate",
+    "to_select": "to select",
+    "to_close": "to close",
     "turn_off": "Tắt",
     "turn_on": "Bật",
     "undo": "Hoàn tác",
@@ -63,7 +66,7 @@
     "terms_and_privacy": "Điều khoản và quyền riêng tư",
     "twitter": "Twitter",
     "type_a_command_search": "Nhập lệnh hoặc tìm kiếm…",
-    "version": "v2.0",
+    "version": "v2.1.0",
     "we_use_cookies": "Chúng tôi sử dụng cookie",
     "whats_new": "Có gì mới?",
     "wiki": "Wiki"
diff --git a/packages/hoppscotch-app/nuxt.config.js b/packages/hoppscotch-app/nuxt.config.js
index 718dd7d4..ba7f7258 100644
--- a/packages/hoppscotch-app/nuxt.config.js
+++ b/packages/hoppscotch-app/nuxt.config.js
@@ -11,7 +11,7 @@ export const options = {
   keywords:
     "hoppscotch, hopp scotch, hoppscotch online, hoppscotch app, postwoman, postwoman chrome, postwoman online, postwoman for mac, postwoman app, postwoman for windows, postwoman google chrome, postwoman chrome app, get postwoman, postwoman web, postwoman android, postwoman app for chrome, postwoman mobile app, postwoman web app, api, request, testing, tool, rest, websocket, sse, graphql, socketio",
   loading: {
-    color: "var(--accent-color)",
+    color: "var(--divider-light-color)",
     background: "var(--primary-color)",
   },
   app: {
diff --git a/packages/hoppscotch-app/pages/index.vue b/packages/hoppscotch-app/pages/index.vue
index 3fd07e6f..e2eb9148 100644
--- a/packages/hoppscotch-app/pages/index.vue
+++ b/packages/hoppscotch-app/pages/index.vue
@@ -46,11 +46,16 @@
             <SmartTab
               :id="'preRequestScript'"
               :label="`${$t('tab.pre_request_script')}`"
+              :indicator="preRequestScript.length > 0"
             >
               <HttpPreRequestScript />
             </SmartTab>
 
-            <SmartTab :id="'tests'" :label="`${$t('tab.tests')}`">
+            <SmartTab
+              :id="'tests'"
+              :label="`${$t('tab.tests')}`"
+              :indicator="testScript.length > 0"
+            >
               <HttpTests />
             </SmartTab>
           </SmartTabs>
@@ -129,6 +134,8 @@ import {
   setRESTRequest,
   setRESTAuth,
   restAuth$,
+  useTestScript,
+  usePreRequestScript,
 } from "~/newstore/RESTSession"
 import { translateExtURLParams } from "~/helpers/RESTExtURLParams"
 import {
@@ -211,6 +218,9 @@ export default defineComponent({
   setup() {
     const requestForSync = ref<HoppRESTRequest | null>(null)
 
+    const testScript = useTestScript()
+    const preRequestScript = usePreRequestScript()
+
     const confirmSync = ref(false)
 
     const syncRequest = () => {
@@ -247,6 +257,8 @@ export default defineComponent({
       syncRequest,
       oAuthURL,
       requestForSync,
+      testScript,
+      preRequestScript,
     }
   },
 })
diff --git a/packages/hoppscotch-app/pages/profile.vue b/packages/hoppscotch-app/pages/profile.vue
index 25bc4bbb..ef0707a6 100644
--- a/packages/hoppscotch-app/pages/profile.vue
+++ b/packages/hoppscotch-app/pages/profile.vue
@@ -79,7 +79,7 @@
                 <h4 class="font-semibold text-secondaryDark">
                   {{ t("settings.profile") }}
                 </h4>
-                <div class="mt-1 text-secondaryLight">
+                <div class="my-1 text-secondaryLight">
                   {{ t("settings.profile_description") }}
                 </div>
                 <div class="py-4">
@@ -141,7 +141,7 @@
                 <h4 class="font-semibold text-secondaryDark">
                   {{ t("settings.sync") }}
                 </h4>
-                <div class="mt-1 text-secondaryLight">
+                <div class="my-1 text-secondaryLight">
                   {{ t("settings.sync_description") }}
                 </div>
                 <div class="space-y-4 py-4">
diff --git a/packages/hoppscotch-app/pages/settings.vue b/packages/hoppscotch-app/pages/settings.vue
index e4981948..67aad691 100644
--- a/packages/hoppscotch-app/pages/settings.vue
+++ b/packages/hoppscotch-app/pages/settings.vue
@@ -6,7 +6,7 @@
           <h3 class="heading">
             {{ $t("settings.theme") }}
           </h3>
-          <p class="mt-1 text-secondaryLight">
+          <p class="my-1 text-secondaryLight">
             {{ $t("settings.theme_description") }}
           </p>
         </div>
@@ -15,7 +15,7 @@
             <h4 class="font-semibold text-secondaryDark">
               {{ $t("settings.background") }}
             </h4>
-            <div class="mt-1 text-secondaryLight">
+            <div class="my-1 text-secondaryLight">
               <ColorScheme placeholder="..." tag="span">
                 {{ $t(getColorModeName($colorMode.preference)) }}
                 <span v-if="$colorMode.preference === 'system'">
@@ -31,7 +31,7 @@
             <h4 class="font-semibold text-secondaryDark">
               {{ $t("settings.accent_color") }}
             </h4>
-            <div class="mt-1 text-secondaryLight">
+            <div class="my-1 text-secondaryLight">
               {{ active.charAt(0).toUpperCase() + active.slice(1) }}
             </div>
             <div class="mt-4">
@@ -58,7 +58,7 @@
             <h4 class="font-semibold text-secondaryDark">
               {{ $t("settings.experiments") }}
             </h4>
-            <div class="mt-1 text-secondaryLight">
+            <div class="my-1 text-secondaryLight">
               {{ $t("settings.experiments_notice") }}
               <SmartLink
                 class="link"
@@ -105,7 +105,7 @@
           <h3 class="heading">
             {{ $t("settings.interceptor") }}
           </h3>
-          <p class="mt-1 text-secondaryLight">
+          <p class="my-1 text-secondaryLight">
             {{ $t("settings.interceptor_description") }}
           </p>
         </div>
@@ -114,7 +114,7 @@
             <h4 class="font-semibold text-secondaryDark">
               {{ $t("settings.extensions") }}
             </h4>
-            <div class="mt-1 text-secondaryLight">
+            <div class="my-1 text-secondaryLight">
               <span v-if="extensionVersion != null">
                 {{
                   `${$t("settings.extension_version")}: v${
@@ -166,7 +166,7 @@
             <h4 class="font-semibold text-secondaryDark">
               {{ $t("settings.proxy") }}
             </h4>
-            <div class="mt-1 text-secondaryLight">
+            <div class="my-1 text-secondaryLight">
               {{
                 `${$t("settings.official_proxy_hosting")} ${$t(
                   "settings.read_the"
diff --git a/packages/hoppscotch-app/windi.config.js b/packages/hoppscotch-app/windi.config.js
index 7356a0a4..b6cf9dd5 100644
--- a/packages/hoppscotch-app/windi.config.js
+++ b/packages/hoppscotch-app/windi.config.js
@@ -41,6 +41,13 @@ export default defineConfig({
         mono: "var(--font-mono)",
         icon: "var(--font-icon)",
       },
+      fontSize: {
+        tiny: "var(--font-size-tiny)",
+        body: "var(--font-size-body)",
+      },
+      lineHeight: {
+        body: "var(--line-height-body)",
+      },
       cursor: {
         nsResize: "ns-resize",
       },