Skip to content

Commit 48bd267

Browse files
zcj220zcj220
committed
v14.0-G4: fix auth panel UI - remove tab border, SVG eye icons, remove status dot/arrow, fix code row layout
1 parent f57cba6 commit 48bd267

1 file changed

Lines changed: 15 additions & 25 deletions

File tree

‎extension/src/sidebarProvider.ts‎

Lines changed: 15 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1657,7 +1657,7 @@ ${commonRules}`;
16571657
}
16581658
.sdrop-auth-tab-bar {
16591659
display: flex; margin-bottom: 8px; gap: 0;
1660-
border: 1px solid var(--input-border); border-radius: 4px; overflow: hidden;
1660+
border-radius: 4px; overflow: hidden;
16611661
}
16621662
.sdrop-tab-btn {
16631663
flex: 1; padding: 4px 0; font-size: 11px; font-weight: 600;
@@ -1701,12 +1701,12 @@ ${commonRules}`;
17011701
.sdrop-eye-btn:focus { outline: none; }
17021702
/* 发送验证码按钮 */
17031703
.sdrop-code-row { display: flex; gap: 4px; margin-bottom: 5px; }
1704-
.sdrop-code-row input { flex: 1; margin-bottom: 0; }
1704+
.sdrop-code-row input { flex: 1; min-width: 0; width: auto; margin-bottom: 0; }
17051705
.sdrop-send-code-btn {
1706-
flex-shrink: 0; padding: 5px 6px; font-size: 10px; font-weight: 600;
1707-
background: none; color: var(--btn-bg);
1708-
border: 1px solid var(--btn-bg); border-radius: 3px; cursor: pointer;
1709-
white-space: nowrap; min-width: 44px;
1706+
flex-shrink: 0; padding: 5px 8px; font-size: 10px; font-weight: 600;
1707+
background: var(--btn-bg); color: var(--btn-fg);
1708+
border: none; border-radius: 3px; cursor: pointer;
1709+
white-space: nowrap;
17101710
}
17111711
.sdrop-send-code-btn:disabled { opacity: 0.4; cursor: not-allowed; }
17121712
.sdrop-login-btn {
@@ -1758,10 +1758,6 @@ ${commonRules}`;
17581758
<div class="sdrop-divider"></div>
17591759
<div class="sdrop-item" id="settingsAuthRow">
17601760
<span id="settingsAuthLabel">🔑 账号</span>
1761-
<span style="display:flex;align-items:center;gap:4px">
1762-
<span id="authStatusDot" style="display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--muted);flex-shrink:0"></span>
1763-
<span id="settingsAuthArrow" style="font-size:10px;color:var(--muted)">▾</span>
1764-
</span>
17651761
</div>
17661762
<div id="settingsAuthPanel" class="sdrop-auth-panel">
17671763
<!-- 登录/注册切换 Tab -->
@@ -1775,7 +1771,7 @@ ${commonRules}`;
17751771
<input id="authUser" type="text" placeholder="用户名或邮箱" autocomplete="username" />
17761772
<div class="sdrop-pass-wrap">
17771773
<input id="authPass" type="password" placeholder="密码" autocomplete="current-password" />
1778-
<button class="sdrop-eye-btn" id="authPassEye" title="显示/隐藏密码">👁</button>
1774+
<button class="sdrop-eye-btn" id="authPassEye" title="显示/隐藏密码"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg></button>
17791775
</div>
17801776
<button class="sdrop-login-btn" id="authLoginBtn">登录</button>
17811777
</div>
@@ -1784,17 +1780,17 @@ ${commonRules}`;
17841780
<div id="regError" class="auth-error"></div>
17851781
<div class="sdrop-code-row">
17861782
<input id="regEmail" type="email" placeholder="邮箱地址" autocomplete="email" />
1787-
<button class="sdrop-send-code-btn" id="btnSendCode">获取</button>
1783+
<button class="sdrop-send-code-btn" id="btnSendCode">发送验证码</button>
17881784
</div>
17891785
<input id="regCode" type="text" placeholder="邮箱验证码（6位）" autocomplete="off" maxlength="6" />
17901786
<input id="regUser" type="text" placeholder="用户名" autocomplete="username" />
17911787
<div class="sdrop-pass-wrap">
17921788
<input id="regPass" type="password" placeholder="密码" autocomplete="new-password" />
1793-
<button class="sdrop-eye-btn" id="regPassEye" title="显示/隐藏密码">👁</button>
1789+
<button class="sdrop-eye-btn" id="regPassEye" title="显示/隐藏密码"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg></button>
17941790
</div>
17951791
<div class="sdrop-pass-wrap">
17961792
<input id="regConfirm" type="password" placeholder="确认密码" autocomplete="new-password" />
1797-
<button class="sdrop-eye-btn" id="regConfirmEye" title="显示/隐藏密码">👁</button>
1793+
<button class="sdrop-eye-btn" id="regConfirmEye" title="显示/隐藏密码"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg></button>
17981794
</div>
17991795
<button class="sdrop-login-btn" id="authRegisterSubmit">注册账号</button>
18001796
</div>
@@ -2027,6 +2023,8 @@ ${commonRules}`;
20272023
}
20282024
20292025
// 眼睛切换
2026+
const SVG_EYE_OPEN = '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>';
2027+
const SVG_EYE_CLOSED = '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M17.94 17.94A10.07 10.07 0 0112 20c-7 0-11-8-11-8a18.45 18.45 0 015.06-5.94M9.9 4.24A9.12 9.12 0 0112 4c7 0 11 8 11 8a18.5 18.5 0 01-2.16 3.19m-6.72-1.07a3 3 0 11-4.24-4.24"/><line x1="1" y1="1" x2="23" y2="23"/></svg>';
20302028
function bindEye(eyeId, inputId) {
20312029
const eye = document.getElementById(eyeId);
20322030
const inp = document.getElementById(inputId);
@@ -2035,7 +2033,7 @@ ${commonRules}`;
20352033
e.stopPropagation();
20362034
const show = inp.type === 'password';
20372035
inp.type = show ? 'text' : 'password';
2038-
eye.textContent = show ? '○' : '●';
2036+
eye.innerHTML = show ? SVG_EYE_CLOSED : SVG_EYE_OPEN;
20392037
eye.title = show ? '隐藏密码' : '显示密码';
20402038
});
20412039
}
@@ -2070,10 +2068,8 @@ ${commonRules}`;
20702068
20712069
function toggleSettingsAuth() {
20722070
const panel = document.getElementById('settingsAuthPanel');
2073-
const arrow = document.getElementById('settingsAuthArrow');
20742071
const open = panel && panel.style.display === 'block';
20752072
if (panel) panel.style.display = open ? 'none' : 'block';
2076-
if (arrow) arrow.textContent = open ? '▾' : '▴';
20772073
if (!open) setTimeout(() => authUser && authUser.focus(), 50);
20782074
}
20792075
@@ -2116,7 +2112,7 @@ ${commonRules}`;
21162112
if (btn) btn.textContent = _codeCountdown + 's';
21172113
if (_codeCountdown <= 0) {
21182114
clearInterval(_codeTimer);
2119-
if (btn) { btn.disabled = false; btn.textContent = '获取'; }
2115+
if (btn) { btn.disabled = false; btn.textContent = '发送验证码'; }
21202116
}
21212117
}, 1000);
21222118
}
@@ -2144,14 +2140,10 @@ ${commonRules}`;
21442140
const authPanel = document.getElementById('settingsAuthPanel');
21452141
const userRow = document.getElementById('settingsUserRow');
21462142
const authLabel = document.getElementById('settingsAuthLabel');
2147-
const authArrow = document.getElementById('settingsAuthArrow');
2148-
const statusDot = document.getElementById('authStatusDot');
21492143
if (loggedIn && user) {
21502144
if (authPanel) authPanel.style.display = 'none';
21512145
if (userRow) userRow.style.display = 'block';
21522146
if (authLabel) authLabel.textContent = '👤 ' + (user.username || '');
2153-
if (authArrow) authArrow.style.display = 'none';
2154-
if (statusDot) { statusDot.style.background = 'var(--success)'; statusDot.title = '已登录'; }
21552147
if (authUsername) authUsername.textContent = user.username || '';
21562148
if (authPlan) authPlan.textContent = user.plan ? '(' + user.plan + ')' : '';
21572149
const creditsEl = document.getElementById('authCredits');
@@ -2164,8 +2156,6 @@ ${commonRules}`;
21642156
if (authPanel) authPanel.style.display = 'none';
21652157
if (userRow) userRow.style.display = 'none';
21662158
if (authLabel) authLabel.textContent = '🔑 账号';
2167-
if (statusDot) { statusDot.style.background = 'var(--muted)'; statusDot.title = '未登录'; }
2168-
if (authArrow) { authArrow.textContent = '▾'; authArrow.style.display = ''; }
21692159
}
21702160
}
21712161
@@ -2568,7 +2558,7 @@ ${commonRules}`;
25682558
// 发送失败：重置倒计时
25692559
if (_codeTimer) { clearInterval(_codeTimer); _codeTimer = null; }
25702560
_codeCountdown = 0;
2571-
if (btn) { btn.disabled = false; btn.textContent = '获取'; }
2561+
if (btn) { btn.disabled = false; btn.textContent = '发送验证码'; }
25722562
showRegError(msg.error || '发送失败');
25732563
} else {
25742564
// 开发模式：dev_code 直接填入验证码框方便测试

0 commit comments

Comments
 (0)