From b29c54f12671a7a9413e68db4f76885cf22b7bb9 Mon Sep 17 00:00:00 2001
From: dekun <dekun@local>
Date: Tue, 7 Jul 2026 12:14:46 +0800
Subject: [PATCH] fix(settings): restore theme toggle on OKX settings page

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 lib/common/static/instance_embed.js           | 25 +++++++++++++++++++
 lib/common/static/instance_theme.css          | 22 +++++++++++++---
 lib/instance/templates/embed_shell.html       |  4 +--
 lib/instance/templates/index.html             |  2 +-
 .../templates/instance_header_panel.html      | 13 +---------
 .../templates/instance_theme_toggle.html      | 12 +++++++++
 lib/instance/templates/settings_panel.html    |  5 +++-
 7 files changed, 64 insertions(+), 19 deletions(-)
 create mode 100644 lib/instance/templates/instance_theme_toggle.html

diff --git a/lib/common/static/instance_embed.js b/lib/common/static/instance_embed.js
index 8cbfe78..0963b12 100644
--- a/lib/common/static/instance_embed.js
+++ b/lib/common/static/instance_embed.js
@@ -238,16 +238,37 @@
     tabBooted.clear();
   }
 
+  function syncShellChrome(tab) {
+    const onSettings = tab === "settings";
+    document.querySelectorAll(".instance-header-panel, .instance-top-bar").forEach((el) => {
+      el.hidden = onSettings;
+    });
+  }
+
+  function initPaneThemeToggle(tab) {
+    if (tab !== "settings") return;
+    const pane = tabPanes.get(tab);
+    if (!pane || !global.InstanceTheme) return;
+    if (typeof global.InstanceTheme.initToggleUI === "function") {
+      global.InstanceTheme.initToggleUI(pane);
+    }
+    if (typeof global.InstanceTheme.syncToggleUI === "function") {
+      global.InstanceTheme.syncToggleUI(pane);
+    }
+  }
+
   function activateTab(tab, opts) {
     const options = opts || {};
     const revisit = !!options.revisit;
     const firstBoot = !tabBooted.has(tab);
+    syncShellChrome(tab);
     showPane(tab);
     setNavActive(tab);
     if (!options.skipUrl) syncUrl(tab, !!options.replace);
     notifyParentTabSwitch(tab);
     if (firstBoot) {
       bootPaneScripts(tab);
+      initPaneThemeToggle(tab);
       runPageInit(tab, { revisit: false });
       return;
     }
@@ -409,7 +430,11 @@
     patchApplyListWindow();
     patchHardNavigations();
     initBootPane();
+    if (getTab() === "settings") {
+      initPaneThemeToggle("settings");
+    }
     bindNav();
+    syncShellChrome(getTab());
     runPageInit(getTab());
     preloadAllTabs();
     try {
diff --git a/lib/common/static/instance_theme.css b/lib/common/static/instance_theme.css
index 7c01a7f..1670998 100644
--- a/lib/common/static/instance_theme.css
+++ b/lib/common/static/instance_theme.css
@@ -2182,6 +2182,13 @@ html[data-theme="light"] .journal-detail-img-thumb {
   flex-wrap: wrap;
 }
 
+.settings-account-summary-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  flex-shrink: 0;
+}
+
 .settings-cards-grid {
   display: grid;
   grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
@@ -2464,12 +2471,21 @@ html[data-theme="light"] .settings-kv-value {
   color: #142232;
 }
 
-html[data-theme="light"] .settings-export-link {
-  background: #fff;
-  border-color: #b8c8d8;
+html[data-theme="light"] .settings-export-link,
+html[data-theme="light"] .settings-export-links-inline a {
+  background: transparent;
+  border-color: transparent;
   color: #1d4f8c;
 }
 
+html[data-theme="light"] .settings-side-export {
+  border-top-color: #d0dae4;
+}
+
+html[data-theme="light"] .settings-side-export-label {
+  color: #142232;
+}
+
 /* OKX 期权页 */
 .options-page-wrap {
   font-size: 0.8rem;
diff --git a/lib/instance/templates/embed_shell.html b/lib/instance/templates/embed_shell.html
index ee131c0..c7cad0f 100644
--- a/lib/instance/templates/embed_shell.html
+++ b/lib/instance/templates/embed_shell.html
@@ -7,7 +7,7 @@
     <link rel="stylesheet" href="/static/instance_theme_early.css?v=4">
     <link rel="stylesheet" href="/static/account_risk_badge.css?v=4">
     <link rel="stylesheet" href="/static/instance_page.css?v=4">
-    <link rel="stylesheet" href="/static/instance_theme.css?v=68">
+    <link rel="stylesheet" href="/static/instance_theme.css?v=69">
     <script src="/static/account_risk_badge.js?v=4"></script>
     <meta name="theme-color" content="#0b0d14">
     <title>{{ exchange_display }} · 加密货币 | 交易监控复盘系统</title>
@@ -91,6 +91,6 @@ const ORDER_ENTRY_MODEL_CODE_TO_CATEGORY = {{ entry_model_code_to_category | toj
 <script src="/static/key_monitor_form.js?v=2"></script>
 {% include 'embed_boot_scripts.html' %}
 <script src="/static/instance_live.js?v=3"></script>
-<script src="/static/instance_embed.js?v=12"></script>
+<script src="/static/instance_embed.js?v=13"></script>
 </body>
 </html>
diff --git a/lib/instance/templates/index.html b/lib/instance/templates/index.html
index 825cbf8..9b654f4 100644
--- a/lib/instance/templates/index.html
+++ b/lib/instance/templates/index.html
@@ -17,7 +17,7 @@
     <link rel="manifest" href="/static/icons/manifest.webmanifest">
     <title>{{ exchange_display }} · 加密货币 | 交易监控复盘系统</title>
     <link rel="stylesheet" href="/static/instance_page.css?v=1">
-    <link rel="stylesheet" href="/static/instance_theme.css?v=68">
+    <link rel="stylesheet" href="/static/instance_theme.css?v=69">
 
 </head>
 <body
diff --git a/lib/instance/templates/instance_header_panel.html b/lib/instance/templates/instance_header_panel.html
index af22b3c..2f308ee 100644
--- a/lib/instance/templates/instance_header_panel.html
+++ b/lib/instance/templates/instance_header_panel.html
@@ -27,18 +27,7 @@
                 {% include 'force_close_header_badge.html' %}
                 <span class="risk-status-badge risk-status-{{ risk_status.status|default('normal') }}" id="account-risk-badge" role="status" title="{{ risk_status.reason|default('', true) }}" data-status-label="{{ risk_status.status_label|default('正常') }}"{% if risk_status.freeze_until_ms %} data-freeze-until-ms="{{ risk_status.freeze_until_ms }}"{% endif %}>{{ risk_status.status_label|default('正常') }}</span>
             </div>
-            <div class="theme-toggle instance-theme-toggle instance-header-theme" role="group" aria-label="界面主题">
-                <button type="button" class="theme-toggle-btn is-active" data-theme-value="dark" aria-pressed="true" title="暗色主题">
-                    <svg class="theme-icon" viewBox="0 0 24 24" width="18" height="18" aria-hidden="true">
-                        <path fill="currentColor" d="M12.1 3a9 9 0 1 0 8.9 11 6.5 6.5 0 1 1-8.9-11z"/>
-                    </svg>
-                </button>
-                <button type="button" class="theme-toggle-btn" data-theme-value="light" aria-pressed="false" title="亮色主题">
-                    <svg class="theme-icon" viewBox="0 0 24 24" width="18" height="18" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round">
-                        <circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M4.93 19.07l1.41-1.41M17.66 6.34l1.41-1.41"/>
-                    </svg>
-                </button>
-            </div>
+            {% include 'instance_theme_toggle.html' %}
         </div>
     </div>
     <div class="instance-header-stats-wrap instance-desktop-only">
diff --git a/lib/instance/templates/instance_theme_toggle.html b/lib/instance/templates/instance_theme_toggle.html
new file mode 100644
index 0000000..5ed8615
--- /dev/null
+++ b/lib/instance/templates/instance_theme_toggle.html
@@ -0,0 +1,12 @@
+<div class="theme-toggle instance-theme-toggle" role="group" aria-label="界面主题">
+    <button type="button" class="theme-toggle-btn is-active" data-theme-value="dark" aria-pressed="true" title="暗色主题">
+        <svg class="theme-icon" viewBox="0 0 24 24" width="18" height="18" aria-hidden="true">
+            <path fill="currentColor" d="M12.1 3a9 9 0 1 0 8.9 11 6.5 6.5 0 1 1-8.9-11z"/>
+        </svg>
+    </button>
+    <button type="button" class="theme-toggle-btn" data-theme-value="light" aria-pressed="false" title="亮色主题">
+        <svg class="theme-icon" viewBox="0 0 24 24" width="18" height="18" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round">
+            <circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M4.93 19.07l1.41-1.41M17.66 6.34l1.41-1.41"/>
+        </svg>
+    </button>
+</div>
diff --git a/lib/instance/templates/settings_panel.html b/lib/instance/templates/settings_panel.html
index 30f7c96..57a01f6 100644
--- a/lib/instance/templates/settings_panel.html
+++ b/lib/instance/templates/settings_panel.html
@@ -6,7 +6,10 @@
                 <div class="exchange-tag">{{ exchange_display }}</div>
                 <span class="risk-status-badge risk-status-{{ risk_status.status|default('normal') }}" role="status">{{ risk_status.status_label|default('正常') }}</span>
             </div>
-            <button type="button" class="btn-secondary btn-sm" id="settings-refresh-funds">刷新资金</button>
+            <div class="settings-account-summary-actions">
+                {% include 'instance_theme_toggle.html' %}
+                <button type="button" class="btn-secondary btn-sm" id="settings-refresh-funds">刷新资金</button>
+            </div>
         </div>
         {% include 'instance_header_stats.html' %}
     </div>