Hermes/FlowPilot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: 移除共享设置操作相关代码，优化侧边栏布局和样式

Browse Source
This commit is contained in:
QLHazyCoder
2026-05-28 21:43:40 +08:00
parent a7f7e68c76
commit 822599194b
14 changed files with 206 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files
sidepanel/sidepanel.css
+50 -27
View File
@@ -40,6 +40,10 @@
--radius-sm: 6px;
--radius-md: 8px;
--data-label-width: 76px;
--data-row-gap: 8px;
--data-field-height: 34px;
--data-inline-action-min-width: 64px;
--transition: 150ms ease;
}
@@ -893,7 +897,8 @@ header {
.data-row {
display: flex;
align-items: center;
gap: 8px;
gap: var(--data-row-gap);
min-width: 0;
}
#settings-card .data-row.module-divider-start {
@@ -919,7 +924,24 @@ header {
display: flex;
align-items: center;
gap: 8px;
flex: 1;
flex: 1 1 0;
min-width: 0;
}
.data-inline > .data-input,
.data-inline > .data-select,
.data-inline > .editable-list-picker,
.data-inline > .input-with-icon {
flex: 1 1 0;
min-width: 0;
}
.data-inline > .auto-delay-input {
flex: 0 0 72px;
}
.data-inline > .data-value {
flex: 1 1 0;
min-width: 0;
}
@@ -1247,41 +1269,37 @@ header {
.input-with-icon {
position: relative;
flex: 1;
flex: 1 1 0;
min-width: 0;
display: flex;
align-items: center;
}
.data-label {
width: 56px;
flex: 0 0 var(--data-label-width);
width: var(--data-label-width);
font-size: 11px;
font-weight: 700;
color: var(--text-muted);
text-transform: uppercase;
letter-spacing: 0.06em;
flex-shrink: 0;
}
#row-codex2api-url .data-label,
#row-codex2api-admin-key .data-label {
width: 76px;
min-width: 0;
}
#row-flow-selector .data-label,
#row-source-selector .data-label,
#row-source-selector .data-label {
text-transform: none;
letter-spacing: 0.02em;
}
#row-codex2api-url .data-label,
#row-codex2api-admin-key .data-label,
#row-grok-webchat2api-url .data-label,
#row-grok-webchat2api-key .data-label,
#row-grok-register-status .data-label,
#row-grok-sso-status .data-label,
#row-grok-webchat2api-upload-status .data-label,
#row-grok-sso-settings .data-label {
width: 76px;
text-transform: none;
letter-spacing: 0.02em;
}
#row-codex2api-url .data-label {
font-size: 10px;
letter-spacing: 0.02em;
text-transform: none;
@@ -1364,7 +1382,10 @@ header {
}
.data-input {
flex: 1;
flex: 1 1 0;
width: 100%;
min-width: 0;
min-height: var(--data-field-height);
padding: 7px 10px;
background: var(--bg-field);
border: 1px solid var(--border);
@@ -1374,7 +1395,6 @@ header {
font-size: 13px;
outline: none;
transition: border-color var(--transition), box-shadow var(--transition);
min-width: 0;
}
.data-input::placeholder { color: var(--text-muted); }
.data-input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-soft); }
@@ -1446,7 +1466,8 @@ header {
}
.choice-group {
flex: 1;
flex: 1 1 0;
width: 100%;
min-width: 0;
display: inline-flex;
align-items: center;
@@ -1526,15 +1547,14 @@ header {
color: var(--text-secondary);
}
#btn-fetch-email,
#btn-save-settings {
#btn-fetch-email {
padding-inline: 10px;
flex-shrink: 0;
}
.data-inline-btn {
flex-shrink: 0;
min-width: 56px;
flex: 0 0 auto;
min-width: var(--data-inline-action-min-width);
justify-content: center;
}
@@ -2072,7 +2092,10 @@ header {
}
.data-select {
flex: 1;
flex: 1 1 0;
width: 100%;
min-width: 0;
min-height: var(--data-field-height);
padding: 7px 10px;
background: var(--bg-field);
border: 1px solid var(--border);
@@ -2083,7 +2106,6 @@ header {
outline: none;
cursor: pointer;
transition: border-color var(--transition);
min-width: 0;
}
.data-select:focus { border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-soft); }
[data-theme="dark"] .data-select { color-scheme: dark; }
@@ -2105,7 +2127,8 @@ header {
.editable-list-picker {
position: relative;
flex: 1;
flex: 1 1 0;
width: 100%;
min-width: 0;
}
sidepanel/sidepanel.html
+24 -24
View File
@@ -405,9 +405,11 @@
</div>
<div class="data-row" id="row-plus-hosted-checkout-oauth-delay" style="display:none;">
<span class="data-label">成功等待</span>
<input type="number" id="input-plus-hosted-checkout-oauth-delay-seconds" class="data-input auto-delay-input"
value="3" min="0" max="120" step="1" />
<span class="setting-caption">支付成功页出现后再继续账号接入</span>
<div class="data-inline">
<input type="number" id="input-plus-hosted-checkout-oauth-delay-seconds" class="data-input auto-delay-input"
value="3" min="0" max="120" step="1" />
<span class="setting-caption">支付成功页出现后再继续账号接入</span>
</div>
</div>
<div class="data-row" id="row-gpc-helper-api" style="display:none;">
<span class="data-label">GPC API</span>
@@ -469,13 +471,15 @@
</div>
<div class="data-row" id="row-gpc-helper-local-sms-enabled" style="display:none;">
<span class="data-label">本地 OTP</span>
<label class="toggle-switch">
<input type="checkbox" id="input-gpc-helper-local-sms-enabled" />
<span class="toggle-switch-track" aria-hidden="true">
<span class="toggle-switch-thumb"></span>
</span>
</label>
<span class="setting-caption">从本机 helper 读取当前通道 OTP，开启后不弹手动验证码</span>
<div class="data-inline">
<label class="toggle-switch">
<input type="checkbox" id="input-gpc-helper-local-sms-enabled" />
<span class="toggle-switch-track" aria-hidden="true">
<span class="toggle-switch-thumb"></span>
</span>
</label>
<span class="setting-caption">从本机 helper 读取当前通道 OTP，开启后不弹手动验证码</span>
</div>
</div>
<div class="data-row" id="row-gpc-helper-local-sms-url" style="display:none;">
<span class="data-label">OTP 接口</span>
@@ -770,12 +774,6 @@
<span id="display-localhost-url" class="data-value data-value-fill mono truncate">等待中...</span>
</div>
</div>
<div class="data-row module-divider-start" id="row-settings-actions">
<span class="data-label">设置</span>
<div class="data-inline data-value-actions">
<button id="btn-save-settings" class="btn btn-outline btn-sm data-inline-btn" type="button">保存</button>
</div>
</div>
</div>
<div id="cloudflare-temp-email-section" class="data-card hotmail-card" style="display:none;">
<div class="section-mini-header">
@@ -1452,14 +1450,16 @@
</div>
<div class="data-row" id="row-phone-signup-relogin-after-bind-email" style="display:none;">
<span class="data-label">绑定后重登</span>
<label class="toggle-switch" for="input-phone-signup-relogin-after-bind-email"
title="手机号注册绑定邮箱后，跳过绑定邮箱验证码，重新刷新 OAuth 并使用绑定邮箱登录">
<input type="checkbox" id="input-phone-signup-relogin-after-bind-email" />
<span class="toggle-switch-track" aria-hidden="true">
<span class="toggle-switch-thumb"></span>
</span>
</label>
<span class="data-value">绑定邮箱后切入邮箱注册模式 OAuth 尾部</span>
<div class="data-inline">
<label class="toggle-switch" for="input-phone-signup-relogin-after-bind-email"
title="手机号注册绑定邮箱后，跳过绑定邮箱验证码，重新刷新 OAuth 并使用绑定邮箱登录">
<input type="checkbox" id="input-phone-signup-relogin-after-bind-email" />
<span class="toggle-switch-track" aria-hidden="true">
<span class="toggle-switch-thumb"></span>
</span>
</label>
<span class="data-value">绑定邮箱后切入邮箱注册模式 OAuth 尾部</span>
</div>
</div>
<div class="data-row" id="row-account-run-history-helper-base-url" style="display:none;">
<span class="data-label">同步服务</span>
sidepanel/sidepanel.js
+5 -17
View File
@@ -60,7 +60,6 @@ const btnToggleVpsUrl = document.getElementById('btn-toggle-vps-url');
const btnToggleVpsPassword = document.getElementById('btn-toggle-vps-password');
const btnFetchEmail = document.getElementById('btn-fetch-email');
const btnTogglePassword = document.getElementById('btn-toggle-password');
const btnSaveSettings = document.getElementById('btn-save-settings');
const btnStop = document.getElementById('btn-stop');
const btnReset = document.getElementById('btn-reset');
const btnContributionMode = document.getElementById('btn-contribution-mode');
@@ -10976,13 +10975,11 @@ function markSettingsDirty(isDirty = true) {
if (isDirty) {
settingsSaveRevision += 1;
}
updateSaveButtonState();
updateSettingsSaveState();
}
function updateSaveButtonState() {
btnSaveSettings.disabled = settingsSaveInFlight || !settingsDirty;
function updateSettingsSaveState() {
updateConfigMenuControls();
btnSaveSettings.textContent = settingsSaveInFlight ? '保存中' : '保存';
}
function isEditableElementInSettingsCard(element) {
@@ -11019,7 +11016,7 @@ async function saveSettings(options = {}) {
const payload = collectSettingsPayload();
const saveRevision = settingsSaveRevision;
settingsSaveInFlight = true;
updateSaveButtonState();
updateSettingsSaveState();
const shouldSkipStateApplyForFocusedEditor = (() => {
if (!silent || source !== 'autosave') {
@@ -11067,7 +11064,7 @@ async function saveSettings(options = {}) {
throw err;
} finally {
settingsSaveInFlight = false;
updateSaveButtonState();
updateSettingsSaveState();
}
}
@@ -15359,14 +15356,6 @@ hotmailServiceModeButtons.forEach((button) => {
});
});
btnSaveSettings.addEventListener('click', async () => {
if (!settingsDirty) {
showToast('配置已是最新', 'info', 1400);
return;
}
await saveSettings({ silent: false }).catch(() => { });
});
btnStop.addEventListener('click', async () => {
btnStop.disabled = true;
await chrome.runtime.sendMessage({ type: 'STOP_FLOW', source: 'sidepanel', payload: {} });
@@ -18823,8 +18812,7 @@ if (typeof initPhoneVerificationSectionExpandedState === 'function') {
initPhoneVerificationSectionExpandedState();
}
applyPhoneSmsProviderOrderSelection([], { ensureDefault: false, syncProvider: false });
updateSaveButtonState();
updateConfigMenuControls();
updateSettingsSaveState();
setLocalCpaStep9Mode(DEFAULT_LOCAL_CPA_STEP9_MODE);
setMail2925Mode(DEFAULT_MAIL_2925_MODE);
setCloudflareTempEmailLookupMode(DEFAULT_CLOUDFLARE_TEMP_EMAIL_LOOKUP_MODE);