Dark-mode <progress> styling + mobile no-sideways-scroll guards

- adapters/bulma.css: dark progress bars (surface track + accent/good fill).
- base: body overflow-x:hidden + overflow-wrap, and .media-content min-width:0
  so long content wraps instead of widening the page on mobile.
This commit is contained in:
Asger Geel Weirsøe
2026-06-14 19:05:00 +02:00
parent ec84e68161
commit b70a65d39e
3 changed files with 17 additions and 159 deletions
-17
View File
@@ -77,23 +77,6 @@ Semantic classes so a site can drop hand-written CSS entirely:
| `.prose` | long-form markdown |
| `.theme-toggle` + `.sun-and-moon` | the sun⇄moon toggle (wire with `weirsoe-theme.js`) |
### App-shell primitives
Reusable building blocks for dashboard/admin UIs (used by `weircon.dk`):
| Class | What |
|---|---|
| `.wt-grid` (`--tight`) | auto-fill responsive card grid |
| `.wt-tile` (`--hover`) + `.wt-tile-head/-ico/-name/-sub/-go` | icon launch card (app launcher) |
| `.wt-stat` + `.wt-stat-n/-label` | big-number stat card |
| `.wt-lead` | muted lead paragraph |
| `.wt-field` + `.wt-field-ico` (wraps `.wt-input`) | search input with leading icon |
| `.wt-flash` (`--error`) | notice / flash banner |
| `.wt-table` | bordered data table |
| `.wt-toolbar` / `.wt-segment` (`button.is-on`) | toolbar + segmented toggle |
| `.wt-select-card` + `-ini/-body/-name/-sub/-chk` | selectable (checkbox) card |
| `.wt-palette` + `-box/-input/-list/-item/-badge/-hint` | ⌘K command palette |
These mirror, 1:1, the chrome of `agw/pw` (asger.weirsøe.dk) — the goal is for
that site to delete `src/styles/global.css` + its inline utility soup and
`@import` this framework instead. Also set the browser UI colour in `<head>`: