dsh-ui-visibility:按桌面与手机分别控制 Harness Web UI 元素显示

前言

DeepSeek Harness(DSH)的 Web 端会同时加载多个社区插件的前端 UI:桌宠、Memory 浮窗、Token 吉祥物等。在窄屏或触屏设备上,这些元素容易挤占可视区域,或与移动端布局(例如抽屉按钮)发生遮挡。若用全局 CSS 或「整页隐藏」类插件,往往无法区分桌面与手机,也不便于逐条开关。

下面介绍社区插件 dsh-ui-visibility(维护者 hatsuyuki280):为非官方社区插件,与 DeepSeek 官方无隶属关系。它按视口(桌面 / 手机)为 Web UI 元素配置可见性规则,并提供设置页与 Host Config 持久化。

这是什么

dsh-ui-visibility 在 Harness Web profile 下运行,用 CSS 选择器描述目标元素,并为每条规则独立设置「启用 / 桌面显示 / 手机显示」。桌面端与手机端的开关互不影响。插件当前版本 0.1.1(MIT 许可),在 SkillHub 插件目录 中归类为「趣味换装」;GitHub 仓库见 hatsuyuki280/dsh-ui-visibility。

核心功能

视口门控与自定义规则

  • 支持任意 CSS 选择器;若使用逗号列表,每个分支都会单独加上视口门控。
  • 设置页可「添加规则」、逐条切换启用与桌面 / 手机显示;保存后立即生效,无需刷新页面。
  • 可修改用于判定「手机端」的媒体查询,默认值为 (pointer: coarse) and (max-width: 1023px)。
  • 可开关 dock 入口下移修复:在手机端将 better-sidebar 的 [data-dsh-dock-fallback] 下移,并叠加 env(safe-area-inset-top),减轻遮挡 dsh-web-mobile 抽屉按钮的情况。

默认示例(可在设置页覆盖)

元素 来源插件 选择器 桌面 手机
Token 吉祥物 dsh-token-viewer [data-token-pet="true"] 显示 隐藏
Memory 浮窗 dsh-memento #mem-open 显示 隐藏
Live2D 桌宠 dsh-pet-live2d [data-dsh-live2d-pet-root] 显示 隐藏
VRM 桌宠 dsh-plugin-vrmpet3d [data-vrmpet3d="1"] 显示 隐藏

上述默认值仅为示例;可在 Settings → 插件显示与隐藏 中按个人 profile 调整。

护栏与紧急恢复

插件内置保护 UI 规则:不能隐藏 DSH 根节点、审批对话框、设置页或侧栏等(例如 html、body、#root、[data-approval-*]、[role=dialog]、.uivis-page、[data-slot="sidebar"])。

隐藏仅作用于视觉层,被隐藏元素的插件逻辑仍在运行,不是安全边界。若界面异常,可在地址后追加查询参数 ?uivis=off,暂停所有隐藏规则;设置页仍可访问。

配置上限(资料原文):最多 200 条规则;单条选择器最多 500 字符;媒体查询最多 300 字符;并对危险字符与未闭合引号 / 括号等做校验。

安装与启用

npm 包发布后的安装方式如下。先做安装,再重启 Web 服务并确认插件已启用。

dsh plugin --profile web add dsh-ui-visibility

经过上面的步骤后:

  1. 重启 dsh web。
  2. 刷新浏览器页面。
  3. 在 Plugins 中确认 dsh-ui-visibility 已启用。

典型用法

  1. 打开 Settings → 插件显示与隐藏。
  2. 查看或修改默认示例规则(例如仅在手机端隐藏桌宠与 Memory 入口)。
  3. 需要控制其他插件 UI 时,使用「添加规则」填写 CSS 选择器,并分别设置桌面 / 手机显示。
  4. 若移动端 dock 与抽屉按钮仍有重叠,可尝试开启 dock 入口下移修复。
  5. 保存后配置写入 Host Config,立即生效。

同类插件中,尚无 README 所描述的「行为等价」方案:例如部分插件可隐藏元素但无桌面 / 手机维度,或只处理模型 / 工作区而非通用 UI。选型时可对照仓库 Wiki: 同类对比 中的说明(检索时间与范围以 Wiki 为准)。

适用场景与注意

适合谁: 经常在手机浏览器或窄视口使用 DSH Web、希望保留桌面端完整插件 UI、同时在移动端精简界面的用户;也适合需要按选择器精细控制多个插件前端元素显示的情况。

环境与兼容(以 package.json 为准):

  • DSH:>=0.2.1-rc.2 且 <0.3.0
  • Node.js:>=22.19
  • 宿主需满足 @deepseek-ai/schemastery >=3.18.3 <4
  • 仅 Web profile;设置页依赖 settings.section 与 configForms

安装前请知悉: DSH 社区插件在宿主进程权限下运行。安装前应阅读源码与 MIT LICENSE,自行评估信任边界。SkillHub 等社区目录为独立站点,与 DeepSeek / 幻方无官方从属关系。

结尾

dsh-ui-visibility 把「哪些插件 UI 在桌面显示、在手机隐藏」做成可配置、可持久化的规则,并带设置页与紧急恢复入口。若你需要在 Harness Web 上按视口整理界面,可从目录页或 GitHub 查看说明与更新:

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

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

小夜