diff --git a/composables/useMQ.js b/composables/useMQ.js
new file mode 100644
index 0000000000000000000000000000000000000000..ec13ce239a62496d790472011c4a2b680b27b4a6
--- /dev/null
+++ b/composables/useMQ.js
@@ -0,0 +1,5 @@
+export const SM = useMediaQuery('(max-width: 640px)')
+export const MD = useMediaQuery('(max-width: 768px)')
+export const LG = useMediaQuery('(max-width: 1024px)')
+export const XL = useMediaQuery('(max-width: 1280px)')
+export const XXL = useMediaQuery('(max-width: 1536px)')
\ No newline at end of file
diff --git a/pages/search/[id].vue b/pages/search/[id].vue
index e119c996369ad127f0cf56fcc593939e63f2853d..65f91258849cbfb2aca79ec557d7bf049cc398f8 100644
--- a/pages/search/[id].vue
+++ b/pages/search/[id].vue
@@ -1,8 +1,8 @@
 <template>
     <div class="w-full items-center flex flex-col">
         <header class="sticky top-0 z-10 bg-white dark:bg-black w-full flex flex-col">
-            <div class="w-full p-2 justify-between items-center flex">
-                <div class="flex-grow justify-center items-center flex space-x-2">
+            <div class="w-full p-2 justify-end sm:justify-between items-center flex">
+                <div class="flex-grow justify-center items-center space-x-2 hidden sm:flex">
                     <UTooltip text="点击修改标题" v-if="!isEditTitle">
                         <div @click="handleFocusTitle">{{ state.query }}</div>
                     </UTooltip>
@@ -16,7 +16,8 @@
                     <span>/</span>
                     <UButton color="gray" variant="ghost" leading-icon="i-heroicons-plus-20-solid">收藏</UButton>
                 </div>
-                <div>
+                <div class="flex gap-2">
+                    <UButton v-if="SM" color="gray" variant="ghost" leading-icon="i-heroicons-plus-20-solid">收藏</UButton>
                     <UButton @click="handleShare" leading-icon="i-heroicons-share-20-solid">分享</UButton>
                 </div>
             </div>