dsh-matrix-terminal:給 DSH Web UI 換一套終端皮膚

前言

在 DSH Web UI 裏跑長會話的人常會遇到同一件事:聊天窗口裏擠滿工具調用、compaction、retry 這類過程行,真正想讀的問答被衝散;界面本身也是通用編輯器觀感,看不出「這是一條終端會話」。dsh-matrix-terminal 就是處理這兩件事的。

它是 DSH 社區插件,維護者是 victorcastro55(package.json 作者名寫作 Victor Castro Solalto),歸類「趣味換裝」,星標數爲 0。社區目錄頁在 https://www.skillhub.cn/plugins/victorcastro55/dsh-matrix-terminal ,源碼在 https://github.com/victorcastro55/dsh-matrix-terminal 。下面介紹它的能力、安裝方式和幾點限制。

這是什麼

一句話定位:磷光綠終端皮膚,把 Web UI 的排版、配色、光標和會話信息層級往終端方向重排。它不改功能,不改行爲,只改界面呈現。

裝上後會話的觀感是:左側只剩提示和回答,像一份 transcript;右側多出一塊工作日誌;composer 下方多出一行僞提示符。

核心功能

README 把改動拆成幾塊,分別是:

設計令牌

Web UI 讀取的 123 個 --dsw-* 令牌全部被覆蓋——surface、文字階梯、髮絲線、brand、按鈕、交互底色、狀態、菜單、markdown 與代碼塊、diff、滾動條,加幾何(圓角全部 0px)和字體族。沒有在令牌之上硬塗顏色,皮膚不會和主題系統打架。

注入樣式

令牌表達不了的部分走一張注入樣式表:

  • body::after:掃描線遮罩,每三個像素一行暗條,指針穿透。
  • body::before:從頂部往下的磷光暈染,邊緣加 vignette。
  • 一套只走綠色、按亮度分層的 Shiki 主題,代碼塊保持等寬綠。
  • 標題加 text-shadow,滾動條切方角,caret 和文字選區變綠。

提示符行

在 composer 底下掛一個 conversation.composer.dock 槽位,內容是 harness@matrix:~$、會話 id 的前八個字符、一個閃爍的方塊光標。如果配套裝了 balance 插件,右側再對齊顯示賬戶餘額。

聊天區變 transcript

原本內聯打印的過程行——工具調用、turn 過程、system prompt、context、compaction、retry、workflow run——不再留在聊天流裏,而是投影到右側日誌。聊天區只保留輸入、模型回答和本輪的結束方式。

右側工作日誌

right sidebar 裏多出一個頁面類型,分爲上下兩塊:上面是 reasoning,每想一步一條;下面是 work log,每次工具調用或過程事件一行,帶時鐘、標籤、主題和耗時。兩塊各自跟隨各自的尾部,一旦你滾動離開就釋放。日誌每個會話自己開一次;你關掉之後到下一次切換會話之前不會再自動彈出來。

安裝與啓用

README 寫明還沒有發佈到 npm,直接從倉庫裝:

dsh plugin --profile web add github:victorcastro55/dsh-matrix-terminal

重啓 dsh web(或讓 profile 自行重載)之後皮膚生效。想同時讓提示符行顯示餘額,裝配套插件:

dsh plugin --profile web add github:victorcastro55/dsh-matrix-terminal-balance

如果要改皮膚源文件並即時生效,可以 clone 後鏈接工作樹:

git clone https://github.com/victorcastro55/dsh-matrix-terminal.git
dsh plugin --profile web add link:"$PWD/dsh-matrix-terminal"

卸載:

dsh plugin --profile web remove dsh-matrix-terminal

README 說令牌層、樣式表和日誌頁類型全部註冊在插件自己的 effect scope 裏,所以刪除後沒有殘留,重啓即恢復原生 Web UI。

典型用法

不需要寫配置文件,裝好、重啓、開 Web profile 就用。進會話之後:

1、左側是對話 transcript,過程行已不在其中。
2、右側自動出現 reasoning 與 work log 兩塊。
3、composer 下方是提示符行,光標在閃。

README 對運行環境的要求是 DeepSeek Harness 0.2.1-rc.5 或兼容版本,並且走 Web profile。

有兩點要注意。其一,work log 依賴右側 sidebar;如果實例沒有側欄,皮膚照樣裝上,只是這一欄拿不到內容。其二,皮膚只做深色,README 原文寫的是「A terminal has one look」,明確不做淺色分支。

它是怎麼做到的

README 的實現說明很短:index.js 是 host 側入口,什麼都不做;皮膚完全在 client 側。client.js 依次做了五件事——註冊 en / zh 兩個 locale namespace;用 ctx.theme.overrideTokens('dsh-matrix-terminal', …) 推色板,疊在當前主題之上而非替換主題系統;把樣式錶帶 data-plugin 標記掛進 DOM,銷燬時移除;註冊提示符槽位;按需注入 sidebarRightTabs / sidebarRight,然後在右側註冊 work log 頁類型。

整個皮膚沒有網絡請求、沒有遙測,數據不出頁面。家族裏唯一可能的出網請求來自配套的 balance 插件,它跑在 host 進程裏,且不暴露密鑰。

適用場景與注意

適合兩類人。一是把 Web UI 當長會話閱讀終端、嫌聊天區被過程行衝散的開發者;二是想給 Web UI 換一套深色皮膚、且不介意只保留一種視覺的人。

兩點使用前提需要自己確認。第一,插件以當前 dsh 進程權限運行,裝之前應當看一下源碼和許可證;本項目是 MIT 許可,作者聲明與 DeepSeek 沒有隸屬關係,也沒有重新分發 Harness 的資源。第二,皮膚只作用於 Web profile;host 側是空的,所以只讀部署的主機或遠程主機同樣能工作,對一些共享環境是優勢。

結尾

dsh-matrix-terminal 做的事很單一:把會話界面往終端的觀感和信息分層上推——問答留在左邊像 transcript,過程進右邊日誌,界面統一爲磷光綠等寬。功能邊界清楚,沒有多餘動作,適合當一件換裝皮膚來嘗。社區目錄頁是 https://www.skillhub.cn/plugins/victorcastro55/dsh-matrix-terminal ,源碼在 https://github.com/victorcastro55/dsh-matrix-terminal 。

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

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

小夜