From ccc82e580218b8a1649554844cac28e22b5a8903 Mon Sep 17 00:00:00 2001
From: Supra4E8C <tan13318527080@163.com>
Date: Sat, 13 Dec 2025 17:15:37 +0800
Subject: [PATCH] fix: refine AI providers and auth files styling and layout
 alignment

  - Remove inset box-shadow from stat badges for cleaner appearance
  - Add modelCountLabel style for consistent model count display
  - Refactor model count layout in AiProvidersPage
  - Add openaiTestButton style for proper button height alignment
  - Add item-actions flexbox utility style to layout.scss
---
 src/pages/AiProvidersPage.module.scss | 20 +++++++++++++++++++-
 src/pages/AiProvidersPage.tsx         | 11 ++++-------
 src/pages/AuthFilesPage.module.scss   |  1 -
 src/styles/layout.scss                |  5 +++++
 4 files changed, 28 insertions(+), 9 deletions(-)

diff --git a/src/pages/AiProvidersPage.module.scss b/src/pages/AiProvidersPage.module.scss
index b2494075..b460e275 100644
--- a/src/pages/AiProvidersPage.module.scss
+++ b/src/pages/AiProvidersPage.module.scss
@@ -70,7 +70,6 @@
   background-color: var(--bg-tertiary);
   color: var(--text-primary);
   white-space: nowrap;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
 }
 
 .statSuccess {
@@ -141,6 +140,18 @@
   flex-wrap: wrap;
   gap: 6px;
   margin-top: 8px;
+  align-items: center;
+}
+
+.modelCountLabel {
+  display: inline-flex;
+  align-items: center;
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 1.4;
+  color: var(--text-tertiary);
+  white-space: nowrap;
+  flex-shrink: 0;
 }
 
 // 单个模型标签
@@ -362,6 +373,13 @@
   }
 }
 
+// 连通性测试按钮高度对齐
+.openaiTestButton {
+  padding: 8px 12px;
+  font-size: 14px;
+  line-height: 1.5;
+}
+
 // 暗色主题适配
 :global([data-theme='dark']) {
   .headerBadge {
diff --git a/src/pages/AiProvidersPage.tsx b/src/pages/AiProvidersPage.tsx
index 19477f5e..0992ec8a 100644
--- a/src/pages/AiProvidersPage.tsx
+++ b/src/pages/AiProvidersPage.tsx
@@ -976,11 +976,9 @@ export function AiProvidersPage() {
                 {/* 模型列表 */}
                 {item.models?.length ? (
                   <div className={styles.modelTagList}>
-                    <div className={styles.fieldRow}>
-                      <span className={styles.fieldLabel}>
-                        {t('ai_providers.claude_models_count')}: {item.models.length}
-                      </span>
-                    </div>
+                    <span className={styles.modelCountLabel}>
+                      {t('ai_providers.claude_models_count')}: {item.models.length}
+                    </span>
                     {item.models.map((model) => (
                       <span key={model.name} className={styles.modelTag}>
                         <span className={styles.modelName}>{model.name}</span>
@@ -1352,9 +1350,8 @@ export function AiProvidersPage() {
                 })}
             </select>
             <Button
-              size="sm"
               variant={openaiTestStatus === 'error' ? 'danger' : 'secondary'}
-              className={openaiTestStatus === 'success' ? styles.openaiTestButtonSuccess : ''}
+              className={`${styles.openaiTestButton} ${openaiTestStatus === 'success' ? styles.openaiTestButtonSuccess : ''}`}
               onClick={testOpenaiProviderConnection}
               loading={openaiTestStatus === 'loading'}
               disabled={saving || openaiAvailableModels.length === 0}
diff --git a/src/pages/AuthFilesPage.module.scss b/src/pages/AuthFilesPage.module.scss
index 6a6f4d97..d361b971 100644
--- a/src/pages/AuthFilesPage.module.scss
+++ b/src/pages/AuthFilesPage.module.scss
@@ -217,7 +217,6 @@
   background-color: var(--bg-tertiary);
   color: var(--text-primary);
   white-space: nowrap;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
 }
 
 .statSuccess {
diff --git a/src/styles/layout.scss b/src/styles/layout.scss
index d297a351..e92134a8 100644
--- a/src/styles/layout.scss
+++ b/src/styles/layout.scss
@@ -404,6 +404,11 @@
       font-weight: 700;
       color: var(--text-primary);
     }
+
+    .item-actions {
+      display: flex;
+      gap: $spacing-sm;
+    }
   }
 
   .toggle-advanced {