From 62060a0603af1a381482b45aaab4563806ba8805 Mon Sep 17 00:00:00 2001
From: Vignesh P <jjaaiiggaanneesshh77@gmail.com>
Date: Mon, 8 Sep 2025 16:26:55 +0530
Subject: [PATCH] fix(common): correct indentation for nested endpoints in
 sidebar (#5370)

---
 .../src/components/collections/ExampleResponse.vue        | 6 +++---
 .../src/components/collections/Request.vue                | 8 ++++----
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/hoppscotch-common/src/components/collections/ExampleResponse.vue b/packages/hoppscotch-common/src/components/collections/ExampleResponse.vue
index c5105aea..d14952a4 100644
--- a/packages/hoppscotch-common/src/components/collections/ExampleResponse.vue
+++ b/packages/hoppscotch-common/src/components/collections/ExampleResponse.vue
@@ -4,11 +4,11 @@
     @contextmenu.prevent="options?.tippy?.show()"
   >
     <div
-      class="pointer-events-auto flex min-w-0 flex-1 space-x-2 cursor-pointer items-center justify-center"
+      class="pointer-events-auto flex min-w-0 flex-1 space-x-1 cursor-pointer items-center justify-center"
       @click="selectResponse()"
     >
       <span
-        class="pointer-events-none flex w-10 px-2 items-center justify-start truncate relative"
+        class="pointer-events-none flex w-8 items-center justify-center truncate relative"
       >
         <span
           class="truncate text-tiny font-semibold relative"
@@ -19,7 +19,7 @@
       </span>
 
       <span
-        class="pointer-events-none flex min-w-0 flex-1 items-center py-2 pr-2 transition group-hover:text-secondaryDark"
+        class="pointer-events-none flex min-w-0 flex-1 items-center py-2 transition group-hover:text-secondaryDark"
       >
         <span class="truncate font-semibold group-hover:text-secondaryDark">
           {{ responseName }}
diff --git a/packages/hoppscotch-common/src/components/collections/Request.vue b/packages/hoppscotch-common/src/components/collections/Request.vue
index 66b1d62d..c286f9a6 100644
--- a/packages/hoppscotch-common/src/components/collections/Request.vue
+++ b/packages/hoppscotch-common/src/components/collections/Request.vue
@@ -22,11 +22,11 @@
       @dragend="resetDragState"
       @contextmenu.prevent="options?.tippy?.show()"
     >
-      <div class="w-5 p-1 flex items-center justify-center">
+      <div class="ms-1 w-3 flex items-center justify-end">
         <component
           :is="isResponseVisible ? IconArrowDown : IconArrowRight"
           v-if="request.responses && Object.keys(request.responses).length > 0"
-          class="svg-icons cursor-pointer hover:bg-primaryDark transition rounded"
+          class="svg-icons w-3 cursor-pointer hover:bg-primaryDark transition rounded"
           @click="toggleRequestResponse()"
         />
       </div>
@@ -35,7 +35,7 @@
         @click="selectRequest()"
       >
         <span
-          class="pointer-events-none flex w-12 items-center justify-start truncate px-2"
+          class="pointer-events-none flex w-8 items-center justify-start truncate px-0.5"
           :style="{ color: getMethodLabelColorClassOf(request.method) }"
         >
           <component
@@ -174,7 +174,7 @@
 
     <div v-if="isResponseVisible" class="flex">
       <div
-        class="ml-[.6rem] flex w-0.5 transform cursor-nsResize bg-dividerLight transition hover:scale-x-125 hover:bg-dividerDark"
+        class="ml-[1.35rem] flex w-0.5 transform cursor-nsResize bg-dividerLight transition hover:scale-x-125 hover:bg-dividerDark"
       ></div>
       <div class="flex flex-col w-full pl-3">
         <CollectionsExampleResponse