Introduction

DSH’s plugin mechanism allows extending the Web UI as independent plugins. For developers or users utilizing the DSH Web UI, if operations are required on mobile devices or narrow screen windows, layout issues such as font size hierarchy, touch targets, input area, sidebar, settings page, message area, statistics row, and Markdown tables need to be handled. dsh-mobile-css is a mobile adaptation plugin that optimizes the mobile experience through pure CSS injection and two lightweight auxiliary scripts.

What is this

dsh-mobile-css is a mobile adaptation plugin for the DeepSeek Harness (DSH) Web UI. The repository address is:

https://github.com/ook826092-cloud/dsh-mobile-css

The username in the repository path is ook826092-cloud. The license is MIT License, and the version in package.json is 1.0.0.

It injects via the official hook:

WebServer.tapIndex()

The overall approach is pure CSS injection + two lightweight auxiliary scripts, zero dependencies, zero source code modification, and uninstallable at any time.

Core Features

Typography and Touch

  • Compact typography system and mobile font stack.
  • Safe touch targets: independent controls ≥44px.
  • Prevents auto-zoom on Android input focus.

Input Area

  • Input card full-width edge-to-edge.
  • Cursor alignment fix.
  • Smart hiding of model names.
  • Send button aligned to the right.
  • Sidebar drawer style: expands to cover the main interface, closes on clicking the overlay, retains a small icon bar when collapsed.
  • Settings page two-page layout: full-screen menu page navigates to a full-screen content page and supports back navigation.

Message Area and Stats Row

  • User message bubbles take up the full width.
  • Bottom action bar wraps to display completely.
  • Tool call summaries allow wrapping.
  • Stats row fixed to two lines showing time+speed, cache+Token.

Markdown Tables

  • Markdown table long cell content auto-wraps.

Trigger Conditions

  • Trigger conditions are pointer: coarse or viewport ≤1024px.
  • Desktop side is completely unaffected.

Installation and Activation

Below are verified installation methods.

Install from GitHub

The following command adds dsh-mobile-css to the web profile:

dsh plugin --profile web add github:ook826092-cloud/dsh-mobile-css

Install by Package Name

The following command is used to add the plugin package with the same name:

dsh plugin --profile web add dsh-mobile-css

Manual Patch

When not using a package manager, edit the following file and add an insert entry:

~/.dsh/profiles/web/cordis.patch.yml

- insert:
    - id: dsh-mobile-css
      name: "dsh-mobile-css"

Then install dependencies and start:

cd ~/.dsh/profiles/web
pnpm add dsh-mobile-css
dsh web

Enable

After the above steps, enable in the following order:

  1. Restart dsh web.
  2. Hard refresh the browser.
  3. Open the DSH Web UI.

Uninstall

Delete the dsh-mobile-css entry in the patch, then restart:

dsh web

This plugin only injects CSS and two event listener scripts, with no network requests, credential access, or file system operations.

Typical Usage

The following are steps to verify directly on a mobile device:

  1. Confirm the current browser satisfies pointer: coarse or viewport ≤1024px.
  2. Open the DSH Web UI and check the input area, sidebar, settings page, message area, stats row, and Markdown tables.
  3. If a specific item does not display in the mobile style, first check the trigger conditions, then check if the DSH Web frontend class names have changed.

Use Cases and Notes

dsh-mobile-css is suitable for scenarios where DSH Web UI is used on mobile browsers or narrow screen windows. Note the following before use:

  • Suitable for modern Chrome / system browsers; the :has() selector requires Chrome 105+.
  • The plugin is written using CSS Modules class name selectors from the DSH Web frontend; if selectors fail after a DSH upgrade, check the corresponding class names.
  • License is MIT License, version in package.json is 1.0.0.
  • This plugin is pure CSS + two event listener scripts, with no network requests, credential access, or file system operations.
  • If added to the current profile, it runs with the permissions of the current dsh process; check the source, source code, and license before installation.

Conclusion

After the above installation and checks, dsh-mobile-css can optimize the mobile layout and touch experience of DSH Web UI using pure CSS injection and two lightweight auxiliary scripts. The relevant addresses are: