dsh-fleeting-light:Apple Intelligence 風格的整窗流光與輸入框跑馬光

前言

DeepSeek Harness(DSH)的 Web 界面長時間打開時,界面往往是靜態的:光標停在某處,窗口既不提示「還在運行」,也不會在視覺上給出輕微反饋。社區裏常見做法是改主題或換皮膚,多半隻動配色,很少在窗口邊緣和輸入框上做連續、低干擾的動效。

下面介紹維護者 QiaoSchoco 發佈的 npm 插件 dsh-fleeting-light(GitHub:QiaoSchoco/dsh-fleeting-light)。它在 DSH 桌面 Web UI 上疊加一層 Apple Intelligence 風格的流光:整窗環境光沿圓角繞行,輸入框邊緣有一條頭尾漸隱的跑馬光;兩層色彩同步,並可在設置裏分別開關。插件歸類爲社區目錄中的「趣味換裝」,當前 GitHub 星標爲 1。

這是什麼

dsh-fleeting-light 是面向 DSH Web 客戶端的裝飾類插件,口號是「讓界面安靜地活着」。它不改動對話邏輯,只在瀏覽器端用 CSS 變量驅動動畫,給主卡片和輸入框(Composer)加環境光與跑馬光。宿主側 apply 爲空實現,主要邏輯集中在 client.js。

核心功能

整窗環境光

沿卡片超橢圓圓角走一整圈底光,分內外兩層:緊貼邊緣的銳光,以及外圈的霧面彌散。四角按圓率挖空,避免亮邊漏出白邊。整層約 4.4 秒 轉一圈(線性、恆定轉速),明暗約 2.6 秒 起伏一次;霧光另有一層 4.6 秒 錯相呼吸。邊緣另有玻璃透光感:高光描邊與內嵌亮邊,光從卡片邊緣透出,而不是浮在表面之上。

輸入框跑馬光

一條綵帶沿輸入框邊緣奔跑,頭尾在 45° 內收到 0:漸細、漸隱後消失,而不是等粗亮線被硬截斷。

色彩同步

底光、跑馬燈、霧光共用同一張「角度 → 色相」映射。光轉到同一位置時,三層色相一致,不會出現跑馬燈與底光各轉各、顏色長期錯位的情況。色相路徑在粉、紫、藍、青到琥珀之間變化(README 中的描述)。

性能與無障礙

插件爲純瀏覽器端:每幀只更新三個 CSS 變量(角度、光帶角寬、霧帶角寬),DOM 結構初始化後不再改動;固定 60fps 的 requestAnimationFrame,一圈 4400ms 線性推進。圖層全程 pointer-events: none 且 aria-hidden,不搶焦點、不擋點擊、不進讀屏。系統開啓 prefers-reduced-motion 時只繪製一幀靜態光,不再旋轉。明、暗主題會自動各調一檔不透明度。

關閉開關後會立刻 cancelAnimationFrame,不殘留定時器。

兩個開關,互不打擾

在 DSH 設置 → 通用 中可分別控制,默認均爲開啓;每組帶「預覽」,便於在設置頁對比開/關效果。

開關 作用 存儲鍵
整窗環境光 窗口四周底光與霧光 dsh-fleeting-light:enabled
輸入框流光 輸入框邊緣跑馬燈與柔光 dsh-composer-light:enabled

安裝與啓用

在 DSH 插件市場搜索「流光」安裝,或使用 npm:

npm i dsh-fleeting-light

安裝後若看不到光效,刷新一次頁面,以便瀏覽器端模塊重新加載。

package.json 中 engines.dsh 爲 >=0.2.1-rc.1 <0.3.0-0;README 寫明在 DSH 0.2.1-rc.3(桌面端 Web UI)上驗證。超出該範圍時,市場可能標記爲未驗證。

典型用法

  1. 按上文命令或市場入口安裝插件,刷新 Web UI。
  2. 打開 設置 → 通用,確認「整窗環境光」「輸入框流光」爲開啓;需要對比時用各組「預覽」開關。
  3. 若只需保留一種效果,關閉另一項即可;存儲鍵分別爲 dsh-fleeting-light:enabled 與 dsh-composer-light:enabled。
  4. 若系統啓用了減少動態效果(prefers-reduced-motion),動畫會自動變爲靜態光,無需額外配置。

適用場景與注意

適合希望在 DSH 裏增加低干擾視覺氛圍、又不需要改業務邏輯的用戶。動畫刻意做得「不打斷你」:無額外彈窗、不攔截指針事件。

安裝前請自行查看 GitHub 源碼與 MIT 許可證(© 2026 QiaoSchoco)。DSH 插件在當前 DSH 進程權限下運行,裝飾類插件同樣會加載到 Web 客戶端;僅當你信任維護者與包內容時再安裝。社區插件目錄(如 SkillHub 上的條目)爲獨立站點,與 DeepSeek / 幻方無官方從屬關係,不要將其等同於官方應用商店。

當前包版本爲 2.15.0(以 package.json 爲準)。

結尾

經過上面的步驟,dsh-fleeting-light 可以在不改動對話流程的前提下,爲 DSH Web 界面加上同步色彩的整窗環境與輸入框流光,並用兩個獨立開關控制。如需詳情與 issue,可訪問 GitHub 倉庫;社區目錄頁:

  • 目錄頁:https://www.skillhub.cn/plugins/QiaoSchoco/dsh-fleeting-light
  • GitHub:https://github.com/QiaoSchoco/dsh-fleeting-light
羽毛球分组比赛记分
小程序二维码

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

小夜