Z
dsh-client-ui-paopaocat
zmm863-commits/dsh-client-ui-paopaocat
DSH Web UI용 판타지 글래스모피즘 스킨입니다. 달빛 어린 지하 숲, 떠다니는 청록 구름, 왼쪽 아래 붉은 꽃무릇, 구석에서 자는 고양이를 고유 배경화면·동영상 배경과 WebGL2 유체 배경 위에 그립니다. 전환 가능한 옅은/채도 높은 파랑 버전 두 가지와 고양이 발·물고기·거품·별빛 장식이 있습니다. 스위치 한 번으로 기본 인터페이스를 정확히 복원합니다.
설치
dsh plugin --profile web add github:zmm863-commits/dsh-client-ui-paopaocatREADME
dsh-client-ui-paopaocat 🐱
泡泡猫玻璃主题 — 基于 Seaglass 架构的蓝白 glassmorphism 主题,为 DeepSeek Harness Web 界面提供可切换的双风格皮肤。
适配版本 — DSH
0.2.0-rc.2(peerDependencies覆盖^0.1.2-rc.1与^0.2.0-rc.1)0.3.3 起
settingsScope改为可选探测:旧版硬声明该服务,在 DSH 0.1.7+ 上会让主题永久 pending 加载不出来。0.3.4 起移除背景音乐功能:播放器、上传与内置曲目入口全部下线,
assets/music/从仓库删除(旧版把 mp3 内联进lib/client.js,会让首屏多下载约 21 MB)。
特性
- 双风格一键切换:设置面板顶部「风格」分段控件,淡雅 / 蓝色 实时切换
- 淡雅:极淡冰蓝白底(
#F5F9FC → #FFFFFF),玻璃近乎透明,装饰极克制 —— 宁静、留白、高字体反差 - 蓝色:饱和蓝白流体(
#87CEEB → #F0F8FF → #E0F7FA),猫爪、泡泡、小鱼、星光装饰 —— 活泼、有存在感
- 淡雅:极淡冰蓝白底(
- 双模式:云母效果把布局改成悬浮玻璃卡片;兼容模式保持原版排版,只换材质
- WebGL2 流体背景:三色渐变 + 噪声 + 漩涡 + 鼠标交互,色调/深浅可调
- 自由背景:流体,或壁纸(内置一张默认壁纸,也可自定义图片/视频;含模糊、磨砂、亮度调节)
- 品牌装饰:猫爪印、小鱼、彩色泡泡、星光、猫角色剪影
- 一键开关:关闭即完全还原原生界面,不改 DSH 任何一行源码
- 中/英文字体自定义
安装
dsh plugin --profile web add dsh-client-ui-paopaocat
刷新 Web 界面即可。关闭开关回到原生界面。
本地开发安装
git clone <repo>
cd dsh-client-ui-paopaocat
npm install
npm run build # tsdown + ModuleLoader 包装 + smoke test
dsh plugin --profile web add "$(pwd)"
设置项
| 分组 | 控件 |
|---|---|
| 总开关 | 开启 / 关闭 |
| 风格 | 淡雅 / 蓝色 |
| 模式 | 云母效果 / 兼容模式 |
| 玻璃材质 | 模糊度 0–40px · 磨砂度 0–100% · 代码块磨砂度 0–100% |
| 背景 | 流体 / 壁纸;流体含色调 0–360° 与深浅 0–100%;壁纸支持图片与视频 |
| 环境装饰 | 猫角色 · 小鱼 · 星光 |
| 悬停效果 | 鼠标辉光 · 悬停下压 |
| 字体 | 英文字体 · 中文字体 |
架构
src/
├── index.ts Host 半边(空实现,纯客户端主题)
└── client/
├── index.ts 入口:locale 注册 + settings.section 挂载
├── ppc-layer.ts 核心层:生命周期 / CSS 变量 / 流体 / 场景 / 辉光
├── ppc-preset.ts 双风格参数(淡雅 / 蓝色)
├── ppc-fluid-shader.ts WebGL2 流体着色器
├── ppc-fluid-tones.ts HSL 调色板生成
├── ppc-ambient-scene.ts 装饰场景组装
├── ppc-brand-assets.ts 猫爪 / 小鱼 / 泡泡 / 星光 / 猫角色 SVG
├── ppc-settings-row.tsx 设置面板 UI
└── ppc.css.ts 全局样式(属性 gating)
技术要点:
- 全部样式经
[data-ppc]属性 gating,卸载即还原 - 客户端 bundle 为单文件 CJS,由
build.mjs包装为window.__ModuleLoader__.load({ id, factory }) - React 通过 factory 的
require获取,无动态 import npm run build内置 headless smoke test,失败即构建失败
素材来源
- 默认壁纸
assets/default-wallpaper.jpg:由 Agnes 图像 API(agnes-image-2.1-flash)生成,暗调电影感主题(绯红彼岸花 + 白虎斑猫),仅做尺寸压缩。 - 猫角色装饰、猫爪、小鱼、泡泡、星光:本插件自绘的内联 SVG(跟随主题色)。
许可
MIT