From 323d066b67d1d8790c1d0ebd637eaf52279e11d6 Mon Sep 17 00:00:00 2001
From: smail <likb_blue@163.com>
Date: Fri, 16 Oct 2026 05:23:39 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E5=AE=89=E5=85=A8=E7=A0=81?=
 =?UTF-8?q?=E6=8C=89=E9=92=AE=E6=A1=8C=E9=9D=A2=E7=AB=AF=E6=A8=AA=E5=90=91?=
 =?UTF-8?q?=E5=B1=85=E4=B8=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

桌面端不再按设置容器宽度误切换纵向布局，移动端按浏览器视口切换；安全码弹窗 footer 强制水平垂直对齐。
---
 .../SecuritySettings/SecuritySettings.css          | 14 +++++++++++---
 .../RecoveryCodeDialog/RecoveryCodeDialog.css      |  7 +++++++
 2 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/frontend/src/views/components/SecuritySettings/SecuritySettings.css b/frontend/src/views/components/SecuritySettings/SecuritySettings.css
index 5bcb55d..97ef508 100644
--- a/frontend/src/views/components/SecuritySettings/SecuritySettings.css
+++ b/frontend/src/views/components/SecuritySettings/SecuritySettings.css
@@ -113,7 +113,17 @@
       "main";
     gap: 16px;
   }
-  .security-key-header, .credential-item, .external-email-header, .external-item { display: flex; flex-direction: column; align-items: stretch; }
+  .credential-item, .external-email-header, .external-item { display: flex; flex-direction: column; align-items: stretch; }
+  .credential-actions { width: 100%; }
+  .credential-actions .el-button { flex: 1; }
+}
+@media (max-width: 767px) {
+  .security-key-header {
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+  }
+
   .security-key-header > .section-actions {
     width: 100%;
     min-width: 0;
@@ -121,8 +131,6 @@
     overflow-x: auto;
     padding-bottom: 2px;
   }
-  .credential-actions { width: 100%; }
-  .credential-actions .el-button { flex: 1; }
 }
 .password-verification-row {
   display: flex;
diff --git a/frontend/src/views/components/UserManagement/RecoveryCodeDialog/RecoveryCodeDialog.css b/frontend/src/views/components/UserManagement/RecoveryCodeDialog/RecoveryCodeDialog.css
index 314bcd7..0ad96b3 100644
--- a/frontend/src/views/components/UserManagement/RecoveryCodeDialog/RecoveryCodeDialog.css
+++ b/frontend/src/views/components/UserManagement/RecoveryCodeDialog/RecoveryCodeDialog.css
@@ -106,6 +106,13 @@
   vertical-align: middle;
 }
 
+:global(.recovery-code-dialog .el-dialog__footer) {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  width: 100%;
+  box-sizing: border-box;
+}
 .recovery-dialog-actions :deep(.el-button + .el-button) {
   margin-left: 0;
 }