Introduction

The width of the chat display area in DSH Web GUI is determined by the CSS variable --dsh-chat-content-width, with the factory default hardcoded to 748px. The chat column, input box, and question card all consume this variable; on wide-screen windows, the content area appears too narrow.

LessXi/dsh-fluid-width addresses this issue by overriding that variable to min(100%, 2000px): the display area flows with the window, with a default 2000px cap, but it can also be changed to fully fluid.

About

LessXi/dsh-fluid-width is a layout plugin for DSH Web GUI, maintained by LessXi, and is licensed under MIT.

It runs on the client side of dsh web, adjusting the chat display area width; the plugin has no host responsibilities.

Core Features

  • Overrides the CSS variable --dsh-chat-content-width to min(100%, 2000px).
  • Automatically follows the width of the chat column, input box, and question card.
  • Sidebar and right panel widths are unaffected.
  • Static override and the MutationObserver version-agnostic override serve as fallbacks for each other.
  • Zero dependencies and no prepare build script.
  • MAX_WIDTH_PX can be customized, or changed to 100% for a fully fluid layout.

Installation and Activation

Execute:

dsh plugin --profile web add github:LessXi/dsh-fluid-width

The plugin has zero dependencies and no prepare build script, so no manual build is required after installation. Steps to enable:

  1. Restart dsh web.
  2. Refresh the browser page.
  3. Open any session, resize the browser window (make it narrower/wider), and the chat content should expand/contract with the window.

Typical Usage

Default Usage

After installation, the default width constraint is min(100%, 2000px): the content area expands when the window gets wider, but caps at 2000px.

Adjusting Width Cap

Edit the constant at the top of lib/client.js:

const MAX_WIDTH_PX = 2000;

Can be adjusted as needed:

  • Change to 100% (combined with the above) for a fully fluid layout with no cap.
  • Change it smaller (e.g., 1200) to make the content converge again.

Uninstallation

Execute:

dsh plugin --profile web remove dsh-fluid-width

Then restart dsh web.

Use Cases and Notes

Suitable for users using dsh web who want the chat display area to fit the window width better.

Notes to consider:

  • The static override depends on the CSS class (.hlCKXq_root) of the conversation root node in the current version.
  • If the class changes after a DSH upgrade and the official styles change to use non-px literals, and both paths fail, simply update ROOT_CLASS to the new class.
  • This repository is distributed according to the DSH bundle contract (dsh.bundle.patchcordis.patch.yml), so there is no need to manually edit the profile’s cordis.patch.yml.
  • The plugin runs with the permissions of the current dsh process; please check the source code and license before installing.

Conclusion

The value of LessXi/dsh-fluid-width is to change the chat display area of DSH Web GUI from fixed width to adaptive width: default min(100%, 2000px), and can be changed to fully fluid or a smaller cap as needed.

  • DSH Community Directory Page: Search by name dsh-fluid-width (independent site, not an official app store)
  • GitHub: https://github.com/LessXi/dsh-fluid-width