From fc341158ab0ef576d35b6c3a4ae6ac44bb3eaed2 Mon Sep 17 00:00:00 2001
From: Jack <jack0210_@hotmail.com>
Date: Mon, 19 Oct 2026 14:18:11 +0800
Subject: [PATCH] keep the credential fields on the theme palette

Chrome flags the filled-in credentials as an autofill match and paints
its own light background and muted fill over the field, which read as a
white block with grey text against the dark card. Take the fill color
back with -webkit-text-fill-color and lay the theme input color over the
injected background with a large inset shadow.

Safe for the password field: masking is done by -webkit-text-security
rendering dots, which fill-color does not affect.
---
 packages/client/src/views/LoginView.vue | 23 +++++++++++++++++++----
 1 file changed, 19 insertions(+), 4 deletions(-)

diff --git a/packages/client/src/views/LoginView.vue b/packages/client/src/views/LoginView.vue
index ae394ab..8708e27 100644
--- a/packages/client/src/views/LoginView.vue
+++ b/packages/client/src/views/LoginView.vue
@@ -404,14 +404,29 @@ function fillDefaultCredentials() {
   font-size: 14px;
 }
 
-// 输入文字：Arco 默认取 --color-text-1，在凹陷底上偏暗，读起来费力。
-// 提亮到接近纯白并把字号抬到 14.5px，保证长用户名与密码都清晰。
-// 不用 -webkit-text-fill-color：它会盖掉密码框的 -webkit-text-security，导致明文泄露。
+// 输入文字：Arco 默认 color: inherit → --color-text-1，在凹陷底上偏暗。
+// 提到接近纯白、字号抬到 14.5px，保证长用户名与密码都清晰。
+// -webkit-text-fill-color 只用于压住 autofill 高亮，不影响密码框的遮蔽：
+// 密码框靠 -webkit-text-security 渲染圆点，不受 fill-color 影响。
 .login-field :deep(.arco-input) {
-  color: oklch(0.975 0.004 200);
+  color: oklch(0.985 0.003 200);
   font-size: 14.5px;
   letter-spacing: 0.01em;
   caret-color: $accent-primary;
+  -webkit-text-fill-color: oklch(0.985 0.003 200);
+}
+
+// autofill / 密码管理器注入的样式：连带背景一起接管，否则会出现白底灰字。
+// 1000px 的 inset 阴影是标准解法：铺满 input 盒子，盖掉 Chrome 注入的浅黄底。
+.login-field :deep(input:-webkit-autofill),
+.login-field :deep(input:-webkit-autofill:hover),
+.login-field :deep(input:-webkit-autofill:focus),
+.login-field :deep(input:-internal-autofill-selected) {
+  -webkit-text-fill-color: oklch(0.985 0.003 200);
+  -webkit-box-shadow: 0 0 0 1000px $bg-input inset;
+  box-shadow: 0 0 0 1000px $bg-input inset;
+  caret-color: $accent-primary;
+  transition: background-color 6000s 0s;
 }
 
 .login-field :deep(.arco-input::placeholder) {