diff --git a/ui/src/components/view/DetailSettings.vue b/ui/src/components/view/DetailSettings.vue
index 276f99093df..57c5343ab7d 100644
--- a/ui/src/components/view/DetailSettings.vue
+++ b/ui/src/components/view/DetailSettings.vue
@@ -56,8 +56,8 @@
             :options="detailValues"
             :placeholder="$t('label.value')"
             @change="e => onAddInputChange(e, 'newValue')" />
-          <tooltip-button :tooltip="$t('label.add.setting')" icon="check-outlined" @onClick="addDetail" buttonClass="detail-button" />
-          <tooltip-button :tooltip="$t('label.cancel')" icon="close-outlined" @onClick="closeDetail" buttonClass="detail-button" />
+          <tooltip-button :tooltip="$t('label.add.setting')" :shape="null" icon="check-outlined" @onClick="addDetail" buttonClass="detail-button" />
+          <tooltip-button :tooltip="$t('label.cancel')" :shape="null" icon="close-outlined" @onClick="closeDetail" buttonClass="detail-button" />
         </a-input-group>
         <p v-if="error" style="color: red"> {{ $t(error) }} </p>
       </div>
diff --git a/ui/src/components/widgets/TooltipButton.vue b/ui/src/components/widgets/TooltipButton.vue
index c0a2a467f21..fa82130217f 100644
--- a/ui/src/components/widgets/TooltipButton.vue
+++ b/ui/src/components/widgets/TooltipButton.vue
@@ -20,10 +20,10 @@
     <template #title v-if="tooltip">
       {{ tooltip }}
     </template>
-    <span style="margin-right: 5px">
+    <span>
       <a-button
         v-if="copyResource"
-        shape="circle"
+        :shape="shape"
         :size="size"
         :type="type"
         :danger="danger"
@@ -39,7 +39,7 @@
       </a-button>
       <a-button
         v-else
-        shape="circle"
+        :shape="shape"
         :size="size"
         :type="type"
         :danger="danger"
@@ -108,6 +108,10 @@ export default {
     danger: {
       type: Boolean,
       default: false
+    },
+    shape: {
+      type: String,
+      default: 'circle'
     }
   },
   methods: {