dsh-backdrop-plugin

Image-background skin for DeepSeek Harness (DSH) — web GUI and the Electron desktop app.

It paints a real photograph as the app background (a bright scene for Light, a night scene for Dark), lays a readability scrim over it, and makes UI surfaces translucent by overriding the --dsw-* design tokens, so the wallpaper shows through the whole interface — plus a built-in panel for importing your own images. No DSH source change, no core logic, no data flow; fully removable.

Features

• Real photo background (#ds-backdrop, background-size: cover), switched by body[data-ds-dark-theme] — independent Light / Dark images.
• Readability scrim baked into the same background-image stack, keeping body text at WCAG-AA contrast.
• Translucent surfaces via --dsw-alias-bg-base, --dsw-alias-bg-layer-*, --dsw-specific-sidebar-fill, --dsw-specific-input-major, --dsw-specific-bubble*, --dsw-specific-menu/selector, border and secondary-label tokens — Light and Dark each with their own values.
• Overrides carry !important: DSH 0.1.5 injects the ui-theme token sheet after client-plugin styles, so equal-specificity overrides would otherwise lose the cascade and surfaces would stay opaque (hiding the wallpaper).
• Import your own images — a small wallpaper button opens a panel with a row per theme: 选择 to pick a file (compressed in-browser via canvas to ≤ ~420 KB), 清除 to fall back, 恢复默认 to reset. You can also drag & drop an image onto the panel to use it for both themes.
• The button is movable — drag it anywhere (many plugins crowd the bottom-right corner). The position is remembered as a viewport-relative fraction, so it survives reloads and window resizes; it is always clamped on screen. Double-click it to snap back to the default bottom-right corner. A drag never opens the panel, and a tap always does. The panel follows the button and flips/clamps itself to stay visible.
• Import-only builds stay inert: the skin only activates when an image exists (body[data-ds-backdrop-on]). A build shipped without artwork does nothing to the UI until you import something.
• Cleanup is fully reversible: ctx.effect removes the layer, style, panel, button and CSS variables.
• No dependencies, no peer dependencies, no lifecycle scripts, no require() of any module — safe for the desktop app's reviewed install policy. Both themes' images are embedded/imported as data URLs, so nothing needs a web server (the desktop opens none).

Requirements

• DSH 0.1.5 or newer (client-plugin contract: dsh.client + exports["./client"] + __ModuleLoader__.load).

Install — Web (dsh web)

cd "$DSH_HOME/profiles/web"          # Windows:  %USERPROFILE%\.dsh\profiles\web
pnpm add dsh-backdrop-plugin

Add the plugin to the profile bundle list so its dsh.bundle.patch is applied:

// $DSH_HOME/profiles/web/package.json  →  dsh.profile.bundles
"bundles": ["@deepseek-ai/dsh-base", "@deepseek-ai/dsh-web-app", "dsh-backdrop-plugin"]

Reload the GUI.

Install — Desktop app

The desktop app installs plugins only from the npm registry (its spec validator rejects file:, paths and any :// URL, and its registry is pinned to https://registry.npmjs.org/). Open Desktop Plugins… from the app menu and install:

[email protected]

The desktop owns its own profile ($DSH_HOME/profiles/desktop), so plugin activation is independent from the CLI/web profile — install it in both if you use both.

Using the import panel

1. Click the wallpaper button — it is subtle until hovered. (It sits bottom-right by default; drag it if another plugin owns that corner, double-click to reset.)
2. 选择 next to 浅色主题 / 深色主题 to pick a local image (PNG/JPEG/WebP), or drag & drop an image anywhere on the panel to set both.
3. 清除 reverts one theme to the built-in image (if the build ships one); 恢复默认 drops both overrides and snaps the button back to its default corner.

The button's position lives in the same local store as your images (dsh-backdrop.user → fab: { fx, fy }), and it is a viewport fraction, so moving the window or switching displays keeps it proportionally placed rather than off screen.

Imported images are stored locally in the browser profile (localStorage, key dsh-backdrop.user), so they are per environment: the web GUI (http://127.0.0.1:3080) and the desktop app (dsh-app://) each keep their own. Nothing is uploaded anywhere.

Build modes

Mode	Ships artwork	Behaviour	Use for
PKG_IMAGES=embed	yes (embedded data URLs)	skin active immediately, panel can override	private / local use
PKG_IMAGES=none	no	skin inert until you import images	publishing (no third-party assets redistributed)

node build_plugin.mjs                       # embed, package name dsh-backdrop
PKG_NAME=dsh-backdrop-plugin PKG_IMAGES=none OUT_DIR=dsh-backdrop-npm node build_plugin.mjs

The build is parameterized because a DSH client entry id must equal the package name in three places at once: package.json name, the registration id inside lib/client.js, and the cordis.patch.yml row.

Disable / remove

• Uninstall: pnpm remove dsh-backdrop-plugin (web) or Remove in the desktop plugin window.
• Or disable: remove the name from dsh.profile.bundles / toggle it off in the desktop plugin list. The layer, panel and token overrides are all retracted and stock DSH returns.

Third-party assets

The embed build contains two wallpapers that are third-party artwork, included for private/local use only and not covered by this package's MIT license. The published build uses PKG_IMAGES=none and therefore redistributes no artwork; users supply their own images through the import panel.

License

MIT (source code only). See the assets note above.