From b3d763c46a923a7521f37058ac5c1e0f3602cae0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=99=B4=E5=A4=A9?= <keh5@vip.qq.com>
Date: Sun, 24 May 2026 02:29:29 +0800
Subject: [PATCH] fix(channels): improve configured card touch targets

---
 src/pages/channels.js |  6 +++---
 src/style/pages.css   | 14 +++++++++++++-
 2 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/pages/channels.js b/src/pages/channels.js
index 5c1cd10..d41292b 100644
--- a/src/pages/channels.js
+++ b/src/pages/channels.js
@@ -1200,7 +1200,7 @@ function renderConfigured(page, state) {
                   ${renderRuntimeAccountInfo(runtimeSummary, acc.accountId || '')}
                   <span class="account-actions">
                     <button class="btn btn-xs btn-secondary" data-action="edit-account" data-account-id="${escapeAttr(acc.accountId || '')}">${icon('edit', 12)} ${t('channels.editAccount')}</button>
-                    <button class="btn btn-xs btn-danger" data-action="remove-account" data-account-id="${escapeAttr(acc.accountId || '')}">${icon('trash', 12)}</button>
+                    <button class="btn btn-xs btn-danger" data-action="remove-account" data-account-id="${escapeAttr(acc.accountId || '')}" aria-label="${escapeAttr(t('channels.remove'))}" title="${escapeAttr(t('channels.remove'))}">${icon('trash', 12)}</button>
                   </span>
                 </div>
               `
@@ -1222,7 +1222,7 @@ function renderConfigured(page, state) {
                   ${supportsMulti ? `<button class="btn btn-sm btn-secondary" data-action="add-account">${icon('plus', 14)} ${t('channels.addAccount')}</button>` : ''}
                   ${reg ? `<button class="btn btn-sm btn-secondary" data-action="edit">${icon('edit', 14)} ${t('channels.editDefault')}</button>` : `<span class="form-hint" style="align-self:center">${t('channels.noGuide')}</span>`}
                   <button class="btn btn-sm btn-secondary" data-action="toggle">${p.enabled ? icon('pause', 14) + ' ' + t('channels.disable') : icon('play', 14) + ' ' + t('channels.enable')}</button>
-                  <button class="btn btn-sm btn-danger" data-action="remove">${icon('trash', 14)}</button>
+                  <button class="btn btn-sm btn-danger" data-action="remove" aria-label="${escapeAttr(t('channels.removePlatformBtn'))}" title="${escapeAttr(t('channels.removePlatformBtn'))}">${icon('trash', 14)}</button>
                 </div>
               </div>
             `
@@ -1249,7 +1249,7 @@ function renderConfigured(page, state) {
                 ${supportsMulti ? `<button class="btn btn-sm btn-secondary" data-action="add-account">${icon('plus', 14)} ${t('channels.addAccount')}</button>` : ''}
                 ${reg ? `<button class="btn btn-sm btn-secondary" data-action="edit">${icon('edit', 14)} ${t('channels.editAccount')}</button>` : `<span class="form-hint" style="align-self:center">${t('channels.noGuide')}</span>`}
                 <button class="btn btn-sm btn-secondary" data-action="toggle">${p.enabled ? icon('pause', 14) + ' ' + t('channels.disable') : icon('play', 14) + ' ' + t('channels.enable')}</button>
-                <button class="btn btn-sm btn-danger" data-action="remove">${icon('trash', 14)}</button>
+                <button class="btn btn-sm btn-danger" data-action="remove" aria-label="${escapeAttr(t('channels.removePlatformBtn'))}" title="${escapeAttr(t('channels.removePlatformBtn'))}">${icon('trash', 14)}</button>
               </div>
             </div>
           `
diff --git a/src/style/pages.css b/src/style/pages.css
index 412aaa7..837570c 100644
--- a/src/style/pages.css
+++ b/src/style/pages.css
@@ -1035,6 +1035,15 @@
   gap: var(--space-xs);
   flex-wrap: wrap;
 }
+.platform-card-actions .btn,
+.account-actions .btn {
+  min-height: 36px;
+  justify-content: center;
+}
+.platform-card-actions .btn-danger,
+.account-actions .btn-danger {
+  min-width: 44px;
+}
 
 .channel-runtime-notice {
   display: flex;
@@ -1166,7 +1175,10 @@
     padding: var(--space-md);
   }
   .platform-card-actions .btn {
-    min-height: 36px;
+    min-height: 44px;
+  }
+  .account-actions .btn {
+    min-height: 40px;
   }
   .account-actions {
     width: 100%;