mirror of
https://github.com/Wei-Shaw/sub2api.git
synced 2026-10-14 12:02:27 +08:00
zichuanwangcloud-gifandClaude Opus 4.8
9707dedca2
The concurrency / switch-rate / throughput cards on the ops dashboard sit in grid cells that only set `min-h-[360px]` (no definite height). Their inner card uses `h-full`, which resolves to `auto` when the parent height is `auto`. Combined with the Chart.js `responsive` + `maintainAspectRatio: false` charts, this forms a height feedback loop: the canvas reads the parent height to size itself, the content then grows, the next ResizeObserver tick reads an even larger height, and the cards stretch downward without bound. On wide screens (`lg:grid-cols-4`) a sibling card usually fixes the row height via `align-items: stretch`, masking the issue. It surfaces when no sibling bounds the row height — e.g. the single-column (`grid-cols-1`) stacked layout on narrow viewports, or when the concurrency card collapses to little content. `min-h` only sets a floor, not a ceiling. Fix: give the two Chart.js canvas cells a definite height (`h-[360px]`) so the responsive resize has a fixed reference and the loop cannot run. The concurrency card is not a responsive canvas, so it keeps `min-h-[360px]` to avoid clipping its content. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>