raheemmiyasin/dsh-theme-palette:給 DSH Web UI 增加九套主題配色

前言

DSH 的理念是「一切皆插件」,界面觀感通常由主題決定,但 Web UI 自帶的配色調整有限。開發者想換一個視覺風格時,往往要改樣式文件、接受默認外觀,或自己寫一套覆蓋層。下面介紹的插件把這件事變成了一個設置項:在 Settings → General 裏增加一行 Theme palette,點選即可切換九套配色。它由 raheemmiyasin 維護,在社區目錄中歸入「趣味換裝」分類。

這是什麼

一句話定位:給 DSH Web UI 增加主題配色選擇器。

它註冊一行 settings.general.item 設置項(order 11.5,位於 Appearance 與字號旁邊),每套配色帶色板預覽。選擇後,插件通過 ctx.theme.overrideTokens() 的一層 --dsw-* 別名 token 覆蓋到當前 light/dark 主題之上。每套配色在明、暗兩種方案下攜帶相同的 token 集,因此原生的 Appearance 行仍照常決定 light / dark / system。

解決的問題是:使用 DSH Web UI 時,無法在不改源碼的前提下切換界面配色。

核心功能

插件提供九套配色:Default、Ocean、Forest、Ember、Violet、Rose、Sand、Obsidian、Cyberpunk。前八套是純配色;Obsidian 爲中性近黑加紫色強調,取自 Obsidian 編輯器主題;Cyberpunk 最複雜,除配色外還附帶 HUD 背景和自定義品牌標識。

配色 token 覆蓋在當前主題之上,Appearance 始終生效。選擇結果保存在該插件自身的 Host 配置中(palette,一個 volatile 文本字段),通過 ctx.configForms.get('theme-palette') 讀寫。它重啓後保留,寫入被拒絕時會回滾這一行。

Cyberpunk 的附加件

Cyberpunk 的兩個附加組件只在選中它時出現,切換後即消失:

  • Backdrop:插件自己的樣式表給 body::before / body::after 兩個指針透明的僞元素上色,包含青色、紫色、品紅霓虹組成的地平線、44px HUD 網格、掃描線和柔光暗角遮罩。面板的表面 token 是半透明的,因此看上去浮在背景上。明色模式下會使用淺色日光變體。移除配色時,該樣式表一併移除。
  • Brand mark:一個原創 SVG 徽標(漸變六邊形、菱形核心、HUD 刻度、青色輝光)替換 sidebar.brand.mark,並填充 conversation.hero.brand.mark。側邊欄的 mark 是單槽位,默認佔位符優先級爲 0,徽標以 −1 優先級註冊來覆蓋它;切換到其他配色時釋放,恢復默認 mark。

安裝與啓用

在 DSH Web UI 中打開 Plugins → Add plugin,粘貼插件目錄的絕對路徑,安裝,然後打開 bundle。設置行會出現在 Settings → General,位置緊鄰 Appearance 下方。

從 Desktop CLI 安裝:

dsh plugin --profile desktop add /absolute/path/to/dsh-theme-palette

由於本地目錄以 link: 方式安裝,修改客戶端部分後刷新頁面即可生效,無需重新安裝。

典型用法

使用方式就是選中 Theme palette 行。例如在 Settings → General 中點選 Cyberpunk,界面會疊加 HUD 背景和自定義品牌標識;切回 Default 則移除這些效果。

如果同時把 Appearance 設爲 light,Cyberpunk 會切換爲淺色日光背景,配色本身保持不變。屬於「改配置、不動源碼」的用法,改完刷新頁面即可。

適用場景與注意

適合會讓 DSH Web UI 換視覺風格、又不想改主題源碼的開發者,以及用 link: 方式安裝、會直接改客戶端代碼的人。

注意:插件以當前 dsh 進程權限運行,安裝前應檢查源碼與許可證。本插件爲 MIT 許可。倉庫中 vendor 的 vendor/schemastery.mjs 與 vendor/cosmokit.mjs 分別取自 Harness 自身的 @deepseek-ai/schemastery 3.19.0 與 @deepseek-ai/cosmokit 1.9.0,兩者均爲 MIT,並保留上游許可:vendor/LICENSE-schemastery(DeepSeek)和 vendor/LICENSE-cosmokit(Shigma,2021 至今)。之所以需要這份本地副本,是因爲 profile 安裝的 bundle 無法解析 Harness 安裝中的包,Host 端要用它聲明 Config schema;volatile 配置引用通過 Symbol.for 標識,因此這些副本能與 Host 的 settings 服務互操作。

結尾

該插件的價值是把換膚從改源碼壓縮爲一次點選,同時不破壞 Appearance 的明暗控制。安裝前記得覈對來源與權限。

目錄頁:https://www.skillhub.cn/plugins/raheemmiyasin/dsh-theme-palette
源碼:https://github.com/raheemmiyasin/dsh-theme-palette

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

小夜