RunCross/dsh-simple-background

README 摘要

@runcross/dsh-simple-background 一个 dsh Web 插件：在 DSH Web 设置 里动态新增 / 修改 CSS，支持背景图片（含本地图片）， 并把用户 JavaScript 保存为真实文件后由页面加载执行。 功能 - 背景图片： - 主背景（URL / data URI / CSS 渐变 / 本地图片；尺寸、位置、重复、不透明度可配； conversation 对话界面 / page 整个页面二选一） - 对话界面模式下可单独设置左侧工作区（侧边栏）背景图 - 左 / 右装饰图片（ leftImage / rightImage ，锚定中间对话区域左右边缘；高度、底部偏移、不透明度可配） - 本地图片目录：把本地文件夹里的图片通过 HTTP 提供给页面 - 设置面板新增「自定义样式 / Custom CSS」页面。 - 动态注入 / 移除 ，保存后立即生效，无需重启 dsh web。 - 可视化 CSS 规则列表（选择器 + 样式声明 + 备注） - 「插入默认规则」：一键生成带说明的常用 CSS 模板 - 用户 JS 文件：保存到 $DSH HOME/custom-css/user.js 并由页面加载 - 浏览器全局 API： window.dshCustomCss 安装 开发模式（本地 link）： 发布/安装为 bundle 后， dsh plugin add 会自动把包名加入 dsh.profile.bundles ；本包的 dsh.bundle.patch 会插入插件行。 使用 打开设置面板 1. 打开 DSH Web 右上/左下「设置」。 2. 进入「自定义样式 / Custom CSS」。 3. 勾选「启用自定义样式」，填写下面的背景配置，点「保存」立即生效。 背景图片配置 插件把背景能力分成三层，按需组合： 1. 主背景 （ backgroundImage ）：铺在对话区或整个页面。 2. 左侧工作区背景 （ sidebarBackgroundImage ）：单独给侧边栏换背景。 3. 左 / 右装饰图片 （ leftImage / rightImage ）：固定在对话区左下 / 右下角的独立图片。 1. 选择背景范围 「背景范围 / backgroundMode」决定主背景铺到哪里： - conversation （对话界面）：只铺中间对话区，侧边栏和详情面板保持原样。 - page （整个页面）：侧边栏 + 对话区 + 详情面板全部铺上。 2. 填写主背景图片地址 「图片地址 / backgroundImage」支持： - http(s)://... 网络图片 - data:image/...;base64,... data URI - CSS 渐变，例如 linear-gradient(135deg, …

分类