Skip to content

Fix BMS At A Glance stat overlap and clipping at narrow widths #714

Description

@bracyw

Bug

The At A Glance strip on the BMS debug page does not degrade gracefully as the window narrows. Between roughly 768px and ~1200px the stat tiles collide instead of wrapping or shrinking:

  • Adjacent values run together into one unreadable string (e.g. Pack Voltage and Average Temp render as "312.846.0" with the degree sign floating in the middle; CCL/DCL/High Voltage mash into "-126.0225.03.459").
  • The Cell/Chip caption labels on High Voltage / Low Voltage / High Temp are clipped mid-word by the neighboring tile's battery icon ("Cell: 76 | Ch...").
  • Below 768px the whole page is blank — tracked separately in Fix blank BMS page below 768px (isMobile placeholder renders nothing) #713.

Steps to reproduce

  1. Open /bms with live data.
  2. Narrow the window to ~800px.
  3. Observe the At A Glance row.

Expected

Stats wrap to a second row, shrink, or truncate with ellipsis — never overlap.

Notes

Observed 2026-07-15 while screenshotting #712 (see that PR's earlier revision for an 800px capture); pre-existing on develop, unrelated to the Open Wire change.

Metadata

Metadata

Assignees

Labels

angular-clientDevelopment Focused in the FrontendbugSomething isn't workingmediumA more complex taskneeds-triageMaintainer needs to evaluate this issue

Type

No type

Fields

No fields configured for issues without a type.

Projects

Status
Todo

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions