chore: minor ui improvements (#3274)

packages/hoppscotch-common/src/components/app/PaneLayout.vue

@@ -18,13 +18,18 @@
         :horizontal="COLUMN_LAYOUT"
         @resize="setPaneEvent($event, 'horizontal')"
       >
-        <Pane :size="PANE_MAIN_TOP_SIZE" class="flex flex-col !overflow-auto">
+        <Pane
+          :size="PANE_MAIN_TOP_SIZE"
+          class="flex flex-col !overflow-auto"
+          min-size="25"
+        >
           <slot name="primary" />
         </Pane>
         <Pane
           v-if="hasSecondary"
           :size="PANE_MAIN_BOTTOM_SIZE"
           class="flex flex-col !overflow-auto"
+          min-size="25"
         >
           <slot name="secondary" />
         </Pane>
@@ -33,7 +38,7 @@
     <Pane
       v-if="SIDEBAR && hasSidebar"
       :size="PANE_SIDEBAR_SIZE"
-      min-size="20"
+      min-size="25"
       class="flex flex-col !overflow-auto bg-primaryContrast"
     >
       <slot name="sidebar" />
@@ -78,10 +83,10 @@ type PaneEvent = {
   size: number
 }
 
-const PANE_MAIN_SIZE = ref(74)
-const PANE_SIDEBAR_SIZE = ref(26)
-const PANE_MAIN_TOP_SIZE = ref(42)
-const PANE_MAIN_BOTTOM_SIZE = ref(58)
+const PANE_MAIN_SIZE = ref(70)
+const PANE_SIDEBAR_SIZE = ref(30)
+const PANE_MAIN_TOP_SIZE = ref(35)
+const PANE_MAIN_BOTTOM_SIZE = ref(65)
 
 if (!COLUMN_LAYOUT.value) {
   PANE_MAIN_TOP_SIZE.value = 50

packages/hoppscotch-common/src/components/app/ShortcutsPrompt.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="flex flex-col items-center justify-center text-secondaryLight">
-    <div class="flex pb-4 my-4 space-x-2">
+    <div class="flex mb-4 space-x-2">
       <div class="flex flex-col items-end space-y-4 text-right">
         <span class="flex items-center flex-1">
           {{ t("shortcut.request.send_request") }}

packages/hoppscotch-common/src/components/environments/my/Details.vue

@@ -81,7 +81,6 @@
             <HoppButtonSecondary
               :label="`${t('add.new')}`"
               filled
-              class="mb-4"
               @click="addEnvironmentVariable"
             />
           </HoppSmartPlaceholder>

packages/hoppscotch-common/src/components/environments/my/index.vue

@@ -42,7 +42,6 @@
         :label="`${t('add.new')}`"
         filled
         outline
-        class="mb-4"
         @click="displayModalAdd(true)"
       />
     </HoppSmartPlaceholder>

packages/hoppscotch-common/src/components/environments/teams/Details.vue

@@ -86,13 +86,11 @@
               disabled
               :label="`${t('add.new')}`"
               filled
-              class="mb-4"
             />
             <HoppButtonSecondary
               v-else
               :label="`${t('add.new')}`"
               filled
-              class="mb-4"
               @click="addEnvironmentVariable"
             />
           </HoppSmartPlaceholder>

packages/hoppscotch-common/src/components/environments/teams/index.vue

@@ -54,7 +54,6 @@
         v-tippy="{ theme: 'tooltip' }"
         disabled
         filled
-        class="mb-4"
         :icon="IconPlus"
         :title="t('team.no_access')"
         :label="t('action.new')"
@@ -64,7 +63,6 @@
         :label="`${t('add.new')}`"
         filled
         outline
-        class="mb-4"
         @click="displayModalAdd(true)"
       />
     </HoppSmartPlaceholder>

packages/hoppscotch-common/src/components/graphql/Authorization.vue

@@ -127,7 +127,6 @@
         blank
         :icon="IconExternalLink"
         reverse
-        class="mb-4"
       />
     </HoppSmartPlaceholder>
     <div v-else class="flex flex-1 border-b border-dividerLight">

packages/hoppscotch-common/src/components/graphql/Headers.vue

@@ -166,7 +166,6 @@
         :label="`${t('add.new')}`"
         filled
         :icon="IconPlus"
-        class="mb-4"
         @click="addHeader"
       />
     </HoppSmartPlaceholder>

packages/hoppscotch-common/src/components/http/Authorization.vue

@@ -126,7 +126,6 @@
         blank
         :icon="IconExternalLink"
         reverse
-        class="mb-4"
       />
     </HoppSmartPlaceholder>
     <div v-else class="flex flex-1 border-b border-dividerLight">

packages/hoppscotch-common/src/components/http/Body.vue

@@ -117,7 +117,6 @@
         blank
         :icon="IconExternalLink"
         reverse
-        class="mb-4"
       />
     </HoppSmartPlaceholder>
   </div>

packages/hoppscotch-common/src/components/http/BodyParameters.vue

@@ -162,7 +162,6 @@
         :label="`${t('add.new')}`"
         filled
         :icon="IconPlus"
-        class="mb-4"
         @click="addBodyParam"
       />
     </HoppSmartPlaceholder>

packages/hoppscotch-common/src/components/http/Headers.vue

@@ -213,7 +213,6 @@
           filled
           :label="`${t('add.new')}`"
           :icon="IconPlus"
-          class="mb-4"
           @click="addHeader"
         />
       </HoppSmartPlaceholder>

packages/hoppscotch-common/src/components/http/Parameters.vue

@@ -161,7 +161,6 @@
           :label="`${t('add.new')}`"
           :icon="IconPlus"
           filled
-          class="mb-4"
           @click="addParam"
         />
       </HoppSmartPlaceholder>

packages/hoppscotch-common/src/components/http/URLEncodedParams.vue

@@ -153,7 +153,6 @@
           filled
           :label="`${t('add.new')}`"
           :icon="IconPlus"
-          class="mb-4"
           @click="addUrlEncodedParam"
         />
       </HoppSmartPlaceholder>