玻璃输入框特效 VioletYJ/dsh-glass-composer

dsh-glass-composer

要把这个插件发到另一台机器：直接看 INSTALL.md，运行附带的 install.sh 即可一键安装（机器级生效，无需切换 profile）。

DSH 本地自定义插件：给输入框加视觉效果，带设置开关。三个独立开关放在设置弹窗左侧边栏的「Glass composer设置」分区里：

1. 新会话流光（默认开）

新会话页（hero，即「新建会话」的空状态）的输入框做成 Google AI Studio「New app」对话框的样子：

- 输入框边缘是一圈 2px 的彩色渐变细描边（Google 蓝 → 紫 → 粉 → 橙 → 青，conic-gradient），沿边框流动（4s/圈）
- 其外是一层弥散柔光——用同一个 conic 渐变加高斯模糊（blur 40px）实现，光晕颜色会跟着描边一起流动（10s/圈），从边框向外铺开约 70px、透明度 0.2，颜色向外均匀淡开、边缘自然消失，没有硬边、也不是一条粗光环，不晕染输入内容
- 悬停时细光环更亮更饱和；系统开启「减弱动态效果」时变为静态
- 只影响新会话页，不影响进入会话后的底部输入框

✅ 该效果的 CSS 选择器用的是官方语义属性（[data-phase="hero"] [data-composer-card]），不依赖构建哈希类名，DSH 升级或换机器都不受影响。

新会话流光效果

2. 玻璃输入框（默认关）

新会话页（hero）的输入框变成 Liquid Glass：半透明 + 28px 背景模糊 + 1.8 饱和度 + 内侧高光，亮/暗主题各自适配，0.3s 过渡。只影响新会话页。

✅ 与「新会话流光」一样使用语义属性选择器（[data-phase="hero"] [data-composer-card]），跨版本稳定。

3. 运行流光（默认开）

agent 正在工作时，会话中的输入框边缘亮起一圈流动的彩色光影：

- 一条 1.5px 的清晰彩色光环沿边框旋转（conic-gradient 跑马灯，3.2s/圈）
- 外圈只带 4px 的轻微光晕，不晕染
- 配色与首页弥散同族（蓝/紫/青/粉）
- agent 停止（回答完/被停止）后光环自动消失，边框颜色有过渡动画
- 系统开启「减弱动态效果」时变为静态光环

运行状态由本插件自己维护：client.js 里带一段运行状态镜像（MutationObserver 检测主按钮的 stop/send 图标），把结果写到官方卡片上的语义属性 data-composer-running。选择器全部用语义 data-* 属性，不含哈希类名，官方升级不会弄坏它。

运行流光效果

运行流光效果（特写）

杂项

- 三个开关状态分别存在 localStorage（dsh.aistudioComposer / dsh.glassComposer / dsh.glowComposer），多标签页自动同步；Host 半会在页面加载时先应用偏好，不闪烁
- 设置位置：设置弹窗 → 左侧边栏 → Glass composer设置（点开后是三个开关；不再出现在「通用」里）
- 改完 client.js（浏览器侧）后刷新页面（F5 / Cmd+R）即可生效；改 index.js（Host 侧引导脚本）后需要完全重启 DSH 才生效

装配方式（已生效）

1. 插件本体复制到共享模块池 ~/.dsh/profiles/node_modules/dsh-glass-composer
2. ~/.dsh/cordis.patch.yml 里登记了 loader 条目（id: glass-composer，name: dsh-glass-composer）

卸载

1. 删除 ~/.dsh/cordis.patch.yml 里的 glass-composer 条目
2. 删除 ~/.dsh/profiles/node_modules/dsh-glass-composer
3. 重启 DSH

调样式

全部样式都在 client.js 顶部的 css 字符串里：

- 新会话流光描边颜色/宽度/速度：搜 --dshAuroraAngle、dshAuroraSpin 和 data-dsh-aistudio-composer 的规则（:before 是描边，:after 是弥散光晕）
- 玻璃浓淡：搜 data-dsh-glass-composer 的两条规则
- 运行流光颜色/速度：搜 dshGlowSpin 和 conic-gradient 那两行