diff --git a/components/i/SearchHistory.vue b/components/i/SearchHistory.vue
index e30547c2e6c29b0735dd32dd0ea7fa3f93dcf09a..415e5937d4cd965f5831a6026f5a2f35f13647a3 100644
--- a/components/i/SearchHistory.vue
+++ b/components/i/SearchHistory.vue
@@ -19,27 +19,26 @@
     </div>
     <div v-if="$isSignIn" class="flex flex-col gap-2 border-l border-gray-200 dark:border-gray-800 pl-2 ml-5">
         <template v-for="(item, index) in searchHistory" :key="index">
-            <div class="flex group">
-                <UButton
-                    class="flex-grow"
-                    color="gray"
-                    variant="ghost"
-                    size="xs"
-                    long
-                    :to="`/search/${item.c_id}`"
-                    @click="handleClickItem"
-                >
-                    <div class="truncate">{{ item.title }}</div>
-                </UButton>
+            <UButton
+                class="flex group"
+                color="gray"
+                variant="ghost"
+                size="xs"
+                long
+                :to="`/search/${item.c_id}`"
+                @click="handleClickItem"
+            >
+                <div class="flex-grow truncate">{{ item.title }}</div>
                 <UButton
                     class="hidden group-hover:flex"
                     color="red"
                     variant="ghost"
                     size="xs"
+                    :padded="false"
                     leading-icon="i-heroicons-x-mark-20-solid"
-                    @click="handleRemoveRecordItem(item.c_id)"
+                    @click.stop.prevent="handleRemoveRecordItem(item.c_id)"
                 />
-            </div>
+            </UButton>
         </template>
     </div>
     <UModal v-model="isOpenHistory" :ui="{ width: 'w-full sm:max-w-screen-md' }">
@@ -62,26 +61,25 @@
         <UDivider />
         <div class="flex flex-col p-2">
             <template v-for="(item, index) in searchHistory" :key="index">
-                <div class="flex group">
-                    <UButton
-                        class="flex-grow"
-                        color="gray"
-                        variant="ghost"
-                        long
-                        leading-icon="i-heroicons-document-text"
-                        :to="`/search/${item.c_id}`"
-                        @click="handleClose"
-                    >
-                        <div class="truncate font-light">{{ item.title }}</div>
-                    </UButton>
+                <UButton
+                    class="flex group"
+                    color="gray"
+                    variant="ghost"
+                    long
+                    leading-icon="i-heroicons-document-text"
+                    :to="`/search/${item.c_id}`"
+                    @click="handleClose"
+                >
+                    <div class="flex-grow truncate font-light">{{ item.title }}</div>
                     <UButton
                         class="hidden group-hover:flex"
                         color="red"
                         variant="ghost"
+                        :padded="false"
                         leading-icon="i-heroicons-x-mark-20-solid"
-                        @click="handleRemoveRecordItem(item.c_id)"
+                        @click.stop.prevent="handleRemoveRecordItem(item.c_id)"
                     />
-                </div>
+                </UButton>
             </template>
         </div>
     </UModal>