前言¶

DSH 支持通過插件擴展 Web UI。對於需要在瀏覽器中調整主題、背景、玻璃質感和控件外觀的場景，dsh-theme-liquid-glass 是一個面向 DSH Web UI 的主題插件。它提供 Liquid Glass 風格、壁紙管理、玻璃參數調整和設置面板，讓外觀調整直接在 Web UI 中完成。下面介紹它的定位、核心能力、安裝方式和需要注意的點。

這是什麼¶

dsh-theme-liquid-glass 是一個用於 DSH Web UI 的 Liquid Glass 主題插件。GitHub owner 爲 FAVKTOXIC，許可證爲 MIT，package.json 中版本爲 0.3.1，README 提到 SVG Edge Refraction (v0.3.0)，運行環境要求 Node >= 18。

它解決的是 Web UI 外觀定製問題：背景壁紙、輸入卡片、消息氣泡、按鈕、模型選擇器和設置入口可以統一呈現 Liquid Glass 風格，並可在設置面板中即時調整。

核心能力¶

下面按功能分組介紹。

Liquid Glass 主題¶

• 使用 ctx.theme.overrideTokens 覆蓋 --dsw-alias-* 語義 token。
• 玻璃參數由 body 上的 --dsh-lg-* CSS 變量驅動，修改即時生效。
• 發送按鈕、視圖標籤、側邊欄操作按鈕和 command (+) 按鈕使用玻璃風格。
• 使用水滴圖標替代默認齒輪作爲設置入口。

邊緣折射¶

輸入卡片、發送按鈕、消息氣泡、視圖標籤、隊列停靠欄和側邊欄按鈕支持 SVG feDisplacementMap 邊緣折射。

背景與壁紙¶

• 支持 Web URL、本地 HTML 文件、本地圖片和本地視頻壁紙。
• 可獨立調整背景模糊（bgBlur）和亮度（brightness）。
• 內置可定製的動畫演示壁紙。
• 視頻壁紙默認靜音，取消靜音可能受 autoplay 策略阻止。
• Web URL 壁紙可通過 host proxy 路由繞過 X-Frame-Options。
• 本地文件選擇器支持上傳壁紙到 POST /liquid-glass/upload，並通過 /liquid-glass/wallpaper/<filename> 服務。

模型 / effort 選擇器¶

重新設計的模型/effort 選擇器，提供 provider-group 網格佈局和懸停高亮。

設置與禁用¶

• 提供 Settings → Liquid Glass 設置面板，支持即時調整和 Reset to defaults。
• 一鍵禁用可移除 token 覆蓋、壁紙和玻璃/折射規則。

安裝與啓用¶

先運行下面的安裝命令，把主題加入 web profile：

dsh plugin --profile web add dsh-theme-liquid-glass

安裝完成後刷新瀏覽器即可啓用。

如果使用本地源碼目錄，可使用本地開發鏈接：

dsh plugin --profile web add "<absolute-path-to-theme-source>"

然後刷新瀏覽器。客戶端更改需要 build 並刷新瀏覽器；修改 host 路由或上傳端點後需要重啓 dsh web。

典型用法¶

下面給出幾個常見操作。

即時調整外觀¶

在 Settings → Liquid Glass 中調整背景、玻璃參數和壁紙設置。修改會即時生效；如果調整不合適，點擊 Reset to defaults 恢復默認。

上傳本地壁紙文件¶

使用本地文件選擇器上傳壁紙。上傳端點爲：

POST /liquid-glass/upload

上傳後的文件通過下面的路徑服務：

/liquid-glass/wallpaper/<filename>

首次啓用演示壁紙¶

首次啓用時，如果 <DSH_HOME>/wallpapers 中不存在 demo.html，插件會寫入內置演示壁紙。壁紙目錄可通過 wallpaperDir 配置修改。

關閉主題¶

通過一鍵禁用移除 token 覆蓋、壁紙和玻璃/折射規則。

存儲與運行注意¶

• 設置保存在瀏覽器 localStorage，鍵名爲 dsh-liquid-glass.settings。切換瀏覽器或清除站點數據會丟失設置。
• 客戶端 bundle 必須導出 inject 服務名數組，否則可能導致 web boot failure。
• 該插件以當前 dsh 進程權限運行，安裝前應檢查源碼與許可證。
• 許可證爲 MIT；package.json 要求 Node >= 18。

結尾¶

經過上面的安裝和調整，dsh-theme-liquid-glass 可以爲 DSH Web UI 提供一套可即時調節的 Liquid Glass 外觀。它適合作爲 Web UI 主題插件使用，用於背景、玻璃質感、按鈕和選擇器的外觀調整。

資料中列出的地址如下：

• 目錄頁：https://www.skillhub.cn/plugins/FAVKTOXIC/dsh-theme-liquid-glass
• GitHub：https://github.com/FAVKTOXIC/dsh-theme-liquid-glass