DSH Web 的默認界面通常側重於功能性。如果需要在不破壞底層結構的情況下調整視覺呈現,直接修改源碼或編寫複雜的 CSS 覆蓋通常成本較高。下面介紹的插件提供了一套完整的主題配置,專注於視覺增強。
插件定位¶
該插件面向 DSH Web,由 JohnnyTing 維護。它在保持頁面結構與交互不變的前提下,爲界面提供流體背景、鼠標彈性網格和雙小魚動態效果。
核心功能¶
- 視覺風格:深藍漸變、半透明玻璃表面和主題 token。
- 交互背景:程序化流體背景與鼠標交互效果;Canvas2D 鼠標彈性網格。
- 動態組件:兩條自主遊動、會避讓鼠標的小魚。
- 控制選項:效果開關與強度設置。
- 兼容性:適配
prefers-reduced-motion、粗指針設備和頁面可見性。 - 資源清理:卸載時清理動畫、事件、DOM 與圖形資源。
安裝與啓用¶
使用官方命令安裝並啓用:
dsh plugin --profile web add github:JohnnyTing/dsh-official-homepage-theme
安裝完成後,刷新或重啓 DSH Web 即可生效。
典型用法¶
從 GitHub 安裝最新版本:
dsh plugin --profile web add github:JohnnyTing/dsh-official-homepage-theme
本地開發時使用絕對路徑:
dsh plugin --profile web add /absolute/path/to/dsh-official-homepage-theme
注意事項¶
- 該包攜帶 DSH bundle 配置,安裝時會自動加入 profile 並加載主題。
lib/*爲生成產物,不要直接編輯。- 插件以當前 DSH 進程權限運行,安裝前應檢查源碼與許可證(MIT)。
總結¶
通過這套配置,你可以快速爲 DSH Web 增加流體與動態效果,提升界面的視覺表現力。更多詳情與源碼,請訪問插件目錄或GitHub 倉庫。