金铲铲海克斯主题 liuyaguang8023/dsh-jcc-theme

金铲铲 · 海克斯核心

dsh-jcc-theme — 给 DeepSeek Harness Web 界面换一副金铲铲同人外观：原创海克斯竞技场背景、金色铲影、四套强化配色与可开关的氛围光效，右下角一枚「海克斯核心」，点开就能换强调色、调棋盘纹理与棱角，或者一键关掉。

非官方同人作品，与腾讯、Riot Games 无关。不含任何游戏素材：图标与底纹都是本仓库用 CSS / SVG 画的几何图形，配色来自公开的设计令牌。「金铲铲之战」「Teamfight Tactics」是其各自权利人的商标。

深色 · 海克斯金

它做了什么

- 两套明暗外观：浅色是羊皮纸棋盘地图，深色是奥术蓝黑竞技场；跟随 DSH 的「浅色 / 深色 / 跟随系统」设置，无需单独开关。
- 原创背景图：夜场是六边形看台、金色铲影与漂浮海克斯晶体；浅色是旧地图等高线、罗盘与同款铲影。两张都以内联 SVG data URI 提供，不额外请求任何图片。
- 四枚强化符文：海克斯金、奥术青、狂暴紫、星界蓝。切换后边框、品牌色、链接、焦点环、侧栏选中态一起换；切换是纯 CSS 属性，不重载页面。
- 棋盘纹理：淡 / 标准 / 浓烈三档，控制界面底层那层六边形网格与两团环境光的强度。
- 氛围光效：一层缓慢呼吸的极光，加两层速度不同的金色浮尘，全部在应用画布之后；面板里可以关掉，prefers-reduced-motion 下自动停止动画。
- 界面棱角：圆润 / 锐利。锐利会同时收紧面板和产品自己的圆角令牌，卡片、按钮、输入框一起变成 HUD 方角。
- 海克斯核心：右下角悬浮的六边形按钮。面板里可以启用/关闭主题、换强调色、调纹理、切棱角、开关氛围光效、恢复默认；选择记在本机 localStorage，刷新后还在。
- 关闭即还原：所有页面级样式都挂在 下。关掉开关（或从插件市场停用）后，原生界面立刻回来，不用卸载。

浅色：

浅色 · 海克斯金

星界蓝 + 锐利棱角 + 浓烈纹理：

深色 · 星界蓝 · 锐利

安装

要求 DSH 0.2.0-rc.1 或更新（含桌面端）。插件只带浏览器半边，没有宿主服务、没有配置 schema、没有终端命令。

从插件市场安装

收录后，在 设置 → 插件市场 里搜索「金铲铲」或 dsh-jcc-theme，一键安装。

从命令行安装

预构建 tarball（推荐，装完不用构建）
dsh plugin --profile web add "https://github.com/liuyaguang8023/dsh-jcc-theme/releases/latest/download/dsh-jcc-theme.tgz"

或直接从源码装（仓库里已带构建产物，无需 npm install）
dsh plugin --profile web add github:liuyaguang8023/dsh-jcc-theme

装完按市场的提示刷新页面；如果宿主在启动时组合 bundle，重启一次 dsh web 即可。

使用

1. 页面右下角出现六边形「海克斯核心」按钮。
2. 点开面板：
- 启用主题 — 总开关，关掉完全还原原生界面；
- 强化符文 — 金 / 青 / 紫 / 蓝四种强调色；
- 棋盘纹理 — 淡 / 标准 / 浓烈；
- 界面棱角 — 圆润 / 锐利；
- 氛围光效 — 极光与金色浮尘的开/关；
- 恢复默认 — 回到海克斯金 + 标准纹理 + 圆润 + 氛围开。
3. 点面板外面或按 Esc 收起。

选择存储在 localStorage 的 dsh-jcc/v1 键里，格式是 {"on":true,"accent":"gold","texture":"normal","ambience":true,"corners":"soft"}。不上传、不联网。

兼容性

| 项目 | 说明 |
| DSH | >=0.2.0-rc.1 <0.3.0-0（engines.dsh） |
| 明暗 | 浅色 / 深色 / 跟随系统，跟随 DSH 令牌 |
| 窄屏 | 面板上移并限制宽度，避免压住输入框 |
| 字体 | 不改字体栈；标题字距、按钮样式也只作用于主题自己的面板 |
| 网络 | 零请求。没有图片、字体、脚本来自外部 |
| 权限 | 不读写文件、不执行命令、不调用宿主 API |

工作原理

- 颜色：在 src/client.js 里按「强调色 × 明暗」生成 --dsw-alias- 令牌，选择器写成
:root[data-jcc="on"][data-jcc-accent="gold"] body[data-ds-dark-theme]，比产品自身的
body[data-ds-dark-theme] 更具体，所以能稳定覆盖、也能随时撤回。
- 背景：两张原创 SVG 场景在构建时编码成 data URI，作为 body 的第一层背景，再叠三条 repeating-linear-gradient（0° / ±60°）的棋盘网格与两层径向光。background-attachment: fixed 让整层背景不随消息滚动。应用框架和各个页面根节点会用 --dsw-alias-bg-base 盖住这层画布，所以客户端会在运行时找出「覆盖整个视口」的画布层并把它们变透明；粘性标题、卡片、附件这类同样用该令牌的小元素保持不透明。
- 氛围：一个 z-index: -1 的固定层，两层浮尘用 background-image + transform 漂移，极光用径向渐变呼吸；画布层透明，所以它只出现在界面背后，不挡文字。
- 棱角：锐利模式同时覆写 --dsw-radius- 与面板自己的圆角变量，保证卡片、按钮和面板一起变方，而不是只有面板。
- 面板：纯 DOM + CSS，不依赖 React、不使用 slots，所以宿主升级换掉组件类名也不会把面板弄坏；唯一耦合的是稳定的 data-ds-dark-theme 属性与设计令牌。
- 构建：client/index.js 由 src/client.js + src/theme.css 拼成，提交进仓库，所以从源码安装不需要构建步骤。

开发

仓库零运行时依赖，只需要 Node 20+。test/dom.mjs 会调用本机 Chrome（找不到时自动跳过）。

npm run build # 重新生成 client/index.js
npm test # manifest + 调色板契约
npm run test:dom # 真 DOM 里把交互跑一遍（headless Chrome）

本地预览：preview/index.html 用产品的真实 token 快照搭了一个 DSH 外壳 open preview/index.html
node scripts/shoot.mjs # 重新生成 assets/ 里的截图

preview/tokens.css 是从 DSH 0.2.1-rc.2 的 dsh-client-ui-theme 抽出的令牌快照，只用于本地预览，不参与发布。

许可

MIT。见 LICENSE。