dsh-settings-beautify

DSH settings panel is assembled from many plugins, yet each contributed page carries its own typography, card radius, and control heights—titles jumping between 16px and 22px, card radii ranging from 8px to 12px, focus rings looking like they came from different design systems. dsh-settings-beautify unifies the entire settings surface onto a single design language: a fixed type-scale hierarchy, consistent card radii and borders, uniform control heights and focus rings, all driven by DSH own --dsw-* design tokens so that light, dark, and system themes all render correctly.

Core capabilities include a consistent three-part page structure (Title Explanation Content), per-role font weight and line-height specifications, 12px card radius and 8px/36px control geometry, subtle hover micro-motion that respects prefers-reduced-motion, and a fully headless architecture—no new entry in the settings nav rail, preferences stored only in localStorage. Any third-party plugin page can opt in by adding a single data-dshb-scan attribute to its root element and the DOM normalizer applies the same typography and surface rules automatically.

Ideal for users who want DSH settings to look like they came from one cohesive design system: people who switch between many plugins daily, developers sensitive to visual consistency, or anyone building custom plugin pages who needs a quick path to uniform styling. The plugin makes no network requests, reads no files, and depends on no host APIs—install, restart, and it works; uninstall, and the original styles return with zero residue.