Public: anyone can read this; the crew can change it.
The `.bt-*` rules leave the stylesheet: no page renders them #5269
Check · Review · Land · Live done — Landed and live in production.
mason/forge:mason/5250-the-bt-rules-leave-the-stylesheet-no-pag → main 1 commit fork
3 files
changed +6
−24
docs/DESIGN.md −8
| @@ -478,14 +478,6 @@ the same line (#4888). | ||
| 478 | 478 | - `.bp-w2` |
| 479 | 479 | - `.bp-w3` |
| 480 | 480 | - `.break` |
| 481 | - `.bt-bar` | |
| 482 | - `.bt-grid` | |
| 483 | - `.bt-group` | |
| 484 | - `.bt-hist` | |
| 485 | - `.bt-name` | |
| 486 | - `.bt-procs` | |
| 487 | - `.bt-row` | |
| 488 | - `.bt-val` | |
| 489 | 481 | - `.commit-body` |
| 490 | 482 | - `.commit-head` |
| 491 | 483 | - `.domain-records` |
src/web/style/content.ts −16
| @@ -229,25 +229,9 @@ a.origin-chip:hover { border-color: var(--border-strong); color: var(--fg); } | ||
| 229 | 229 | .bform .qf > span { font-size: 12.5px; font-weight: 600; color: var(--fg); } |
| 230 | 230 | .bform .field { margin: 0; flex: 1 1 140px; min-width: 0; } |
| 231 | 231 | .bform .btn { flex: none; } |
| 232 | .bt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 2px 16px; font-family: var(--mono); font-size: 12.5px; margin-top: 8px; } | |
| 233 | .bt-row { display: grid; grid-template-columns: 10ch minmax(40px, 1fr) auto auto; align-items: center; gap: 8px; min-width: 0; } | |
| 234 | .bt-row > .bt-val:last-child { grid-column: span 2; } | |
| 235 | .bt-name { color: var(--muted-fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } | |
| 236 | .bt-val { text-align: right; white-space: nowrap; } | |
| 237 | .bt-hist { color: var(--accent); letter-spacing: -1px; overflow: hidden; max-width: 15ch; } | |
| 238 | .bt-bar { width: 100%; height: 8px; appearance: none; background: var(--muted); border: 0; border-radius: var(--radius-sm); overflow: hidden; } | |
| 239 | .bt-bar::-webkit-meter-bar { background: var(--muted); border: 0; height: 8px; } | |
| 240 | .bt-bar::-webkit-meter-optimum-value, .bt-bar::-webkit-meter-suboptimum-value { background: var(--accent); } | |
| 241 | .bt-bar::-webkit-meter-even-less-good-value { background: var(--danger); } | |
| 242 | .bt-bar::-moz-meter-bar { background: var(--accent); } | |
| 243 | .bt-bar:-moz-meter-sub-optimum::-moz-meter-bar { background: var(--accent); } | |
| 244 | .bt-bar:-moz-meter-sub-sub-optimum::-moz-meter-bar { background: var(--danger); } | |
| 245 | 232 | .table-wrap { overflow-x: auto; max-width: 100%; } |
| 246 | 233 | #summary { display: flex; flex-wrap: wrap; gap: 6px; } |
| 247 | 234 | #summary .pill { max-width: 100%; white-space: normal; } |
| 248 | .bt-procs { font-size: 12.5px; } | |
| 249 | .bt-procs th, .bt-procs td { padding: 2px 8px; white-space: nowrap; } | |
| 250 | .bt-group th, .bt-group td { background: var(--muted); font-weight: 600; } | |
| 251 | 235 | .bgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; } |
| 252 | 236 | .bp-w2 { grid-column: span 2; } |
| 253 | 237 | .bp-w3 { grid-column: span 3; } |
test/system-btop.test.ts +6
| @@ -11,6 +11,7 @@ import { createLive } from "../src/system/live.ts"; | ||
| 11 | 11 | import { parseDiskstats, type Proc, type Raw } from "../src/system/proc.ts"; |
| 12 | 12 | import { buildSystem, forAgent } from "../src/system/view.ts"; |
| 13 | 13 | import { regions } from "../src/web/pages/system.ts"; |
| 14 | import { content } from "../src/web/style/content.ts"; | |
| 14 | 15 | import { systemLines } from "../src/tui/screens/system.ts"; |
| 15 | 16 | import { procSortJs, systemLiveJs } from "../src/web/system-live.ts"; |
| 16 | 17 | |
| @@ -116,6 +117,11 @@ describe("/system as btop", () => { | ||
| 116 | 117 | expect(r["sys-procs"]).toContain("2 procs"); |
| 117 | 118 | }); |
| 118 | 119 | |
| 120 | test("the stylesheet no longer carries the retired .bt-* rules (#5250)", () => { | |
| 121 | expect(content).not.toMatch(/\.bt-[a-z]/); | |
| 122 | for (const old of ["bt-bar", "bt-grid", "bt-group", "bt-hist", "bt-name", "bt-procs", "bt-row", "bt-val"]) expect(content).not.toContain(old); | |
| 123 | }); | |
| 124 | ||
| 119 | 125 | test("diskstats keep whole devices only", () => { |
| 120 | 126 | const text = " 259 0 nvme0n1 10 0 8 0 20 0 16 0\n 259 1 nvme0n1p1 1 0 2 0 1 0 2 0\n 7 0 loop0 1 0 2 0 0 0 0 0\n"; |
| 121 | 127 | expect(parseDiskstats(text, (n) => n === "nvme0n1")).toEqual([{ name: "nvme0n1", read: 8 * 512, write: 16 * 512 }]); |
new above
offline