From a9f4ec963b3e951f5cbf86725bf0959b78cd1962 Mon Sep 17 00:00:00 2001
From: jxxghp <jxxghp@gmail.com>
Date: Mon, 22 Jun 2026 13:25:23 +0800
Subject: [PATCH] fix(plugin): align market detail actions on small screens

---
 .../dialog/PluginMarketDetailDialog.vue          | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/components/dialog/PluginMarketDetailDialog.vue b/src/components/dialog/PluginMarketDetailDialog.vue
index 379e5740..c69d9b78 100644
--- a/src/components/dialog/PluginMarketDetailDialog.vue
+++ b/src/components/dialog/PluginMarketDetailDialog.vue
@@ -228,7 +228,7 @@ onUnmounted(() => {
                   :text="props.plugin?.system_version_message || t('plugin.incompatibleSystemVersion')"
                 />
                 <div class="plugin-market-detail-actions">
-                  <div>
+                  <div class="plugin-market-detail-actions__buttons">
                     <VBtn
                       color="primary"
                       @click="installPlugin()"
@@ -237,7 +237,7 @@ onUnmounted(() => {
                     >
                       {{ t('plugin.installToLocal') }}
                     </VBtn>
-                    <VBtn variant="tonal" @click="showUpdateHistory" prepend-icon="mdi-update" class="ms-2">
+                    <VBtn variant="tonal" @click="showUpdateHistory" prepend-icon="mdi-update">
                       {{ t('plugin.versionHistory') }}
                     </VBtn>
                   </div>
@@ -264,6 +264,14 @@ onUnmounted(() => {
   gap: 0.75rem;
 }
 
+.plugin-market-detail-actions__buttons {
+  /* 窄屏换行时用统一 gap 控制按钮间距，避免第二个按钮带左边距导致视觉偏移。 */
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  gap: 0.5rem;
+}
+
 .plugin-market-detail-actions__downloads {
   flex-basis: 100%;
   color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
@@ -276,6 +284,10 @@ onUnmounted(() => {
     justify-content: flex-start;
   }
 
+  .plugin-market-detail-actions__buttons {
+    justify-content: flex-start;
+  }
+
   .plugin-market-detail-actions__downloads {
     text-align: start;
   }