The left sidebar of DSH can become crowded as the number of conversations grows, and quickly locating a specific conversation among many sessions requires a visual distinction method. The dsh-sidebar-marks plugin solves this by adding marks to each conversation. It runs on the Web UI through CSS injection and row attribute modification, without relying on any runtime environment.

What Is This

This plugin is maintained by QIN-SMART and belongs to the “Fun Dress-Up” category. It modifies the DOM structure and styles of the left sidebar to provide visual identifiers for each conversation. The plugin supports Windows, macOS, and Linux, uses the MIT license, and has zero runtime dependencies.

Installation

Add the plugin using the official installation command:

dsh plugin --profile web add github:QIN-SMART/dsh-sidebar-marks

After installation, refresh the browser page to apply changes. There is no need to restart DSH Web.

Core Features

The plugin provides three marking styles:

  1. Full-row background tint: The color and intensity are customizable. Intensity can be set to 8%, 10% (default), 12%, 16%, 22%, or “None”. In dark themes, it is automatically increased by one level (+4 points).
  2. Colored dot: It can be displayed on the “right edge”, “left of title”, “both sides”, or “None”. Six preset colors are provided (blue, green, amber, red, purple, slate blue), along with custom color support.
  3. Independent title font size: The title font size can be adjusted independently for each conversation. It defaults to the original size and can be set from 12px to 16px.

Usage

Open the Mark Panel

  • Menu: Hover over a conversation row in the left sidebar, click the “…” menu, and select “Mark…”.
  • Shortcut: In the sidebar, press ⌘⇧M (Mac) or Ctrl+Shift+M (Windows/Linux).
  • Right-click: Right-click any conversation row to open the mark panel directly.

Options changed in the panel take effect immediately, and data is saved automatically (debounced for 200 ms). A “Clear marks” button is provided in the lower-left corner. Press Esc or click outside the panel to close it.

Configuration Options

  • Color: Six presets or custom (supports hex color codes, such as #8b5cf6).
  • Background intensity: 8% / 10% / 12% / 16% / 22% / None.
  • Dot position: Right edge / Left of title / Both sides / None.
  • Title font size: Original / 12 / 13 / 14 / 15 / 16 px.

Notes

  • Data storage: All mark data is stored in the browser’s localStorage['dsh.sidebar-marks.v1']. Because it is bound to the origin, changing the port or switching browsers may cause the data to be lost.
  • Fallback behavior: When a conversation is running (the DSH status dot occupies the left-side space) or has been archived, the “left of title” dot automatically disappears. However, the full-row background, right-edge dot, and font size are not affected.
  • Theme adaptation: In dark themes, the plugin automatically adjusts background intensity and color brightness to maintain visibility.

This plugin provides a clear visual hierarchy for the DSH sidebar and is suitable for developers who need to manage a large number of sessions. For more details, see the GitHub repository.