diff --git a/web/src/components/atomic/IconButton.vue b/web/src/components/atomic/IconButton.vue
index 023213d0f..a7bf4dbbd 100644
--- a/web/src/components/atomic/IconButton.vue
+++ b/web/src/components/atomic/IconButton.vue
@@ -47,6 +47,6 @@ defineProps<{
 @reference '~/tailwind.css';
 
 .icon-button {
-  @apply hover-effect relative flex items-center justify-center overflow-hidden rounded-md bg-transparent px-1 py-1 disabled:cursor-not-allowed disabled:opacity-50;
+  @apply hover-effect relative flex cursor-pointer items-center justify-center overflow-hidden rounded-md bg-transparent px-1 py-1 disabled:cursor-not-allowed disabled:opacity-50;
 }
 </style>
diff --git a/web/src/components/layout/Panel.vue b/web/src/components/layout/Panel.vue
index 77ac1cb23..d7f4cf20a 100644
--- a/web/src/components/layout/Panel.vue
+++ b/web/src/components/layout/Panel.vue
@@ -7,6 +7,9 @@
       v-if="title"
       type="button"
       class="bg-wp-background-400 text-wp-text-100 flex w-full gap-2 px-4 py-2 font-bold"
+      :class="{
+        'cursor-pointer': collapsable,
+      }"
       @click="_collapsed = !_collapsed"
     >
       <Icon
diff --git a/web/src/views/repo/pipeline/PipelineConfig.vue b/web/src/views/repo/pipeline/PipelineConfig.vue
index 1daed896b..c76dbc671 100644
--- a/web/src/views/repo/pipeline/PipelineConfig.vue
+++ b/web/src/views/repo/pipeline/PipelineConfig.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="flex flex-col gap-y-6">
+  <div class="flex flex-col gap-y-4">
     <Panel
       v-for="pipelineConfig in pipelineConfigsDecoded"
       :key="pipelineConfig.hash"