From ded1c0ca9fccf7d4518a380c5752d675e1cd2ef7 Mon Sep 17 00:00:00 2001 From: cyfung1031 <44498510+cyfung1031@users.noreply.github.com> Date: Wed, 10 Jun 2026 11:13:45 +0900 Subject: [PATCH 1/4] fix #1497: Avoid White Background during initial load --- src/index.css | 15 +++++++++++++++ src/pages/options.html | 2 -- src/pages/popup.html | 2 -- src/pages/template.html | 4 ---- 4 files changed, 15 insertions(+), 8 deletions(-) diff --git a/src/index.css b/src/index.css index 6b2ef8509..266ec04a7 100644 --- a/src/index.css +++ b/src/index.css @@ -6,6 +6,21 @@ scrollbar-color: inherit; } +html { + --body-background-color: #fff; + --body-text-color: #1d2129; +} + +html.dark { + --body-background-color: #232324; + --body-text-color: #ffffffe6; +} + +html, body { /* lowest priority */ + background-color: var(--color-bg-2, var(--body-background-color)); + color: var(--color-text-1, var(--body-text-color)); +} + body { scrollbar-color: var(--color-scrollbar-thumb) var(--color-scrollbar-track); } diff --git a/src/pages/options.html b/src/pages/options.html index 3e3c3840a..6792f614b 100644 --- a/src/pages/options.html +++ b/src/pages/options.html @@ -11,8 +11,6 @@ body { height: 100%; overflow: hidden; - background-color: var(--color-bg-2); - color: var(--color-text-1); } diff --git a/src/pages/popup.html b/src/pages/popup.html index dfccc4a64..a4105a5c8 100644 --- a/src/pages/popup.html +++ b/src/pages/popup.html @@ -8,8 +8,6 @@ From cda16851ced2794e344e0531f3133a48b91caebb Mon Sep 17 00:00:00 2001 From: cyfung1031 <44498510+cyfung1031@users.noreply.github.com> Date: Wed, 10 Jun 2026 11:32:40 +0900 Subject: [PATCH 2/4] common.ts --- src/pages/batchupdate/main.tsx | 1 + src/pages/common.ts | 17 +++++++++++++++++ src/pages/confirm/main.tsx | 1 + src/pages/import/main.tsx | 1 + src/pages/install/main.tsx | 1 + src/pages/options/main.tsx | 1 + src/pages/popup/main.tsx | 1 + 7 files changed, 23 insertions(+) create mode 100644 src/pages/common.ts diff --git a/src/pages/batchupdate/main.tsx b/src/pages/batchupdate/main.tsx index f87ac8a8a..ace3c3d08 100644 --- a/src/pages/batchupdate/main.tsx +++ b/src/pages/batchupdate/main.tsx @@ -9,6 +9,7 @@ import MessageWriter from "@App/app/logger/message_writer.ts"; import "@arco-design/web-react/dist/css/arco.css"; import "@App/locales/locales"; import "@App/index.css"; +import "@App/pages/common.ts"; import "./index.css"; // 初始化日志组件 diff --git a/src/pages/common.ts b/src/pages/common.ts new file mode 100644 index 000000000..313f4c477 --- /dev/null +++ b/src/pages/common.ts @@ -0,0 +1,17 @@ +let inited = false; +if (!inited) { + inited = true; + try { + const lightMode = localStorage.getItem("lightMode") || "auto"; + if (lightMode === "dark") { + document.documentElement.classList.add("dark"); + } else if (lightMode === "auto") { + const darkTheme = window.matchMedia("(prefers-color-scheme: dark)"); + if (darkTheme.matches) { + document.documentElement.classList.add("dark"); + } + } + } catch (e) { + console.warn(e); + } +} diff --git a/src/pages/confirm/main.tsx b/src/pages/confirm/main.tsx index 51985671b..31f0be6ff 100644 --- a/src/pages/confirm/main.tsx +++ b/src/pages/confirm/main.tsx @@ -9,6 +9,7 @@ import MessageWriter from "@App/app/logger/message_writer.ts"; import "@arco-design/web-react/dist/css/arco.css"; import "@App/locales/locales"; import "@App/index.css"; +import "@App/pages/common.ts"; // 初始化日志组件 const loggerCore = new LoggerCore({ diff --git a/src/pages/import/main.tsx b/src/pages/import/main.tsx index fe51ddedd..be9cd357b 100644 --- a/src/pages/import/main.tsx +++ b/src/pages/import/main.tsx @@ -9,6 +9,7 @@ import MessageWriter from "@App/app/logger/message_writer.ts"; import "@arco-design/web-react/dist/css/arco.css"; import "@App/locales/locales"; import "@App/index.css"; +import "@App/pages/common.ts"; // 初始化日志组件 const loggerCore = new LoggerCore({ diff --git a/src/pages/install/main.tsx b/src/pages/install/main.tsx index 7f87023e2..32361dc44 100644 --- a/src/pages/install/main.tsx +++ b/src/pages/install/main.tsx @@ -9,6 +9,7 @@ import MessageWriter from "@App/app/logger/message_writer.ts"; import "@arco-design/web-react/dist/css/arco.css"; import "@App/locales/locales"; import "@App/index.css"; +import "@App/pages/common.ts"; import "./index.css"; import registerEditor from "@App/pkg/utils/monaco-editor"; import { BrowserRouter, Route, Routes } from "react-router-dom"; diff --git a/src/pages/options/main.tsx b/src/pages/options/main.tsx index 096203c58..6f8924a7f 100644 --- a/src/pages/options/main.tsx +++ b/src/pages/options/main.tsx @@ -6,6 +6,7 @@ import { AppProvider } from "../store/AppContext.tsx"; import "@arco-design/web-react/dist/css/arco.css"; import "@App/locales/locales"; import "@App/index.css"; +import "@App/pages/common.ts"; import "./index.css"; import LoggerCore from "@App/app/logger/core.ts"; import { LoggerDAO } from "@App/app/repo/logger.ts"; diff --git a/src/pages/popup/main.tsx b/src/pages/popup/main.tsx index 05b3e94c1..d6a90fe60 100644 --- a/src/pages/popup/main.tsx +++ b/src/pages/popup/main.tsx @@ -7,6 +7,7 @@ import MessageWriter from "@App/app/logger/message_writer.ts"; import "@arco-design/web-react/dist/css/arco.css"; import "@App/locales/locales"; import "@App/index.css"; +import "@App/pages/common.ts"; import "./index.css"; import PopupLayout from "../components/layout/PopupLayout.tsx"; import { AppProvider } from "../store/AppContext.tsx"; From dd8940b951222336fee10c57d3dcafcbc4f0a268 Mon Sep 17 00:00:00 2001 From: cyfung1031 <44498510+cyfung1031@users.noreply.github.com> Date: Wed, 10 Jun 2026 11:52:17 +0900 Subject: [PATCH 3/4] common.ts --- rspack.config.ts | 2 ++ src/pages/common.ts | 1 + src/pages/options.html | 1 + src/pages/popup.html | 2 +- src/pages/template.html | 1 + 5 files changed, 6 insertions(+), 1 deletion(-) diff --git a/rspack.config.ts b/rspack.config.ts index fff70db2a..1a97c36da 100644 --- a/rspack.config.ts +++ b/rspack.config.ts @@ -28,6 +28,7 @@ const chunkExcludeSet = new Set([ "content", "inject", "scripting", + "common", ]); export default { @@ -53,6 +54,7 @@ export default { content: `${src}/content.ts`, scripting: `${src}/scripting.ts`, inject: `${src}/inject.ts`, + common: `${src}/pages/common.ts`, popup: `${src}/pages/popup/main.tsx`, install: `${src}/pages/install/main.tsx`, batchupdate: `${src}/pages/batchupdate/main.tsx`, diff --git a/src/pages/common.ts b/src/pages/common.ts index 313f4c477..c8183b7a0 100644 --- a/src/pages/common.ts +++ b/src/pages/common.ts @@ -1,3 +1,4 @@ +// this is a standalone script to load as fast as possible in extension pages. let inited = false; if (!inited) { inited = true; diff --git a/src/pages/options.html b/src/pages/options.html index 6792f614b..ac8219a89 100644 --- a/src/pages/options.html +++ b/src/pages/options.html @@ -3,6 +3,7 @@ + <%= htmlRspackPlugin.options.title %> <% if isReactTools=="true" { %> diff --git a/src/pages/popup.html b/src/pages/popup.html index a4105a5c8..ad12fe28c 100644 --- a/src/pages/popup.html +++ b/src/pages/popup.html @@ -3,7 +3,7 @@ - + <%= htmlRspackPlugin.options.title %>