dsh-fleeting-light:Apple Intelligence 风格的整窗流光与输入框跑马光

前言

DeepSeek Harness(DSH)的 Web 界面长时间打开时,界面往往是静态的:光标停在某处,窗口既不提示「还在运行」,也不会在视觉上给出轻微反馈。社区里常见做法是改主题或换皮肤,多半只动配色,很少在窗口边缘和输入框上做连续、低干扰的动效。

下面介绍维护者 QiaoSchoco 发布的 npm 插件 dsh-fleeting-light(GitHub:QiaoSchoco/dsh-fleeting-light)。它在 DSH 桌面 Web UI 上叠加一层 Apple Intelligence 风格的流光:整窗环境光沿圆角绕行,输入框边缘有一条头尾渐隐的跑马光;两层色彩同步,并可在设置里分别开关。插件归类为社区目录中的「趣味换装」,当前 GitHub 星标为 1。

这是什么

dsh-fleeting-light 是面向 DSH Web 客户端的装饰类插件,口号是「让界面安静地活着」。它不改动对话逻辑,只在浏览器端用 CSS 变量驱动动画,给主卡片和输入框(Composer)加环境光与跑马光。宿主侧 apply 为空实现,主要逻辑集中在 client.js。

核心功能

整窗环境光

沿卡片超椭圆圆角走一整圈底光,分内外两层:紧贴边缘的锐光,以及外圈的雾面弥散。四角按圆率挖空,避免亮边漏出白边。整层约 4.4 秒 转一圈(线性、恒定转速),明暗约 2.6 秒 起伏一次;雾光另有一层 4.6 秒 错相呼吸。边缘另有玻璃透光感:高光描边与内嵌亮边,光从卡片边缘透出,而不是浮在表面之上。

输入框跑马光

一条彩带沿输入框边缘奔跑,头尾在 45° 内收到 0:渐细、渐隐后消失,而不是等粗亮线被硬截断。

色彩同步

底光、跑马灯、雾光共用同一张「角度 → 色相」映射。光转到同一位置时,三层色相一致,不会出现跑马灯与底光各转各、颜色长期错位的情况。色相路径在粉、紫、蓝、青到琥珀之间变化(README 中的描述)。

性能与无障碍

插件为纯浏览器端:每帧只更新三个 CSS 变量(角度、光带角宽、雾带角宽),DOM 结构初始化后不再改动;固定 60fps 的 requestAnimationFrame,一圈 4400ms 线性推进。图层全程 pointer-events: none 且 aria-hidden,不抢焦点、不挡点击、不进读屏。系统开启 prefers-reduced-motion 时只绘制一帧静态光,不再旋转。明、暗主题会自动各调一档不透明度。

关闭开关后会立刻 cancelAnimationFrame,不残留定时器。

两个开关,互不打扰

在 DSH 设置 → 通用 中可分别控制,默认均为开启;每组带「预览」,便于在设置页对比开/关效果。

开关 作用 存储键
整窗环境光 窗口四周底光与雾光 dsh-fleeting-light:enabled
输入框流光 输入框边缘跑马灯与柔光 dsh-composer-light:enabled

安装与启用

在 DSH 插件市场搜索「流光」安装,或使用 npm:

npm i dsh-fleeting-light

安装后若看不到光效,刷新一次页面,以便浏览器端模块重新加载。

package.json 中 engines.dsh 为 >=0.2.1-rc.1 <0.3.0-0;README 写明在 DSH 0.2.1-rc.3(桌面端 Web UI)上验证。超出该范围时,市场可能标记为未验证。

典型用法

  1. 按上文命令或市场入口安装插件,刷新 Web UI。
  2. 打开 设置 → 通用,确认「整窗环境光」「输入框流光」为开启;需要对比时用各组「预览」开关。
  3. 若只需保留一种效果,关闭另一项即可;存储键分别为 dsh-fleeting-light:enabled 与 dsh-composer-light:enabled。
  4. 若系统启用了减少动态效果(prefers-reduced-motion),动画会自动变为静态光,无需额外配置。

适用场景与注意

适合希望在 DSH 里增加低干扰视觉氛围、又不需要改业务逻辑的用户。动画刻意做得「不打断你」:无额外弹窗、不拦截指针事件。

安装前请自行查看 GitHub 源码与 MIT 许可证(© 2026 QiaoSchoco)。DSH 插件在当前 DSH 进程权限下运行,装饰类插件同样会加载到 Web 客户端;仅当你信任维护者与包内容时再安装。社区插件目录(如 SkillHub 上的条目)为独立站点,与 DeepSeek / 幻方无官方从属关系,不要将其等同于官方应用商店。

当前包版本为 2.15.0(以 package.json 为准)。

结尾

经过上面的步骤,dsh-fleeting-light 可以在不改动对话流程的前提下,为 DSH Web 界面加上同步色彩的整窗环境与输入框流光,并用两个独立开关控制。如需详情与 issue,可访问 GitHub 仓库;社区目录页:

  • 目录页:https://www.skillhub.cn/plugins/QiaoSchoco/dsh-fleeting-light
  • GitHub:https://github.com/QiaoSchoco/dsh-fleeting-light
羽毛球分组比赛记分
小程序二维码

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

小夜