feat(dashboard): split monolithic CSS into common + per-page bundles
dashboard.css was 2500+ lines covering every page. Split into four
separate esbuild entry points:
- common.css — @hive/shared imports + shared typography, badges,
buttons, inbox/compose, side panel, diff panel,
path linkification, logs-header chrome (shared by
flow + logs)
- dashboard.css — dashboard-only styles (tabs, container rows,
approvals, questions, permissions, schedules, etc.)
- flow.css — flow page chrome (frosted header, composer, inbox pill)
- logs.css — log viewer sub-tabs (journal-*, build-logs-*)
Each HTML file now loads common.css + its own page-specific bundle.
build.mjs updated to produce all four CSS outputs. All builds pass.
Closes #1056
This commit is contained in:
parent
ed6f40ba40
commit
ea5115c3a6
8 changed files with 949 additions and 1136 deletions
|
|
@ -10,8 +10,12 @@
|
|||
// dist/static/logs.js /logs.html entry — build/agent/system
|
||||
// log viewer sub-tabs
|
||||
// dist/static/{tabs,flow,logs}.js.map source map siblings
|
||||
// dist/static/dashboard.css served at /static/dashboard.css
|
||||
// (@import resolved from @hive/shared)
|
||||
// dist/static/common.css loaded by every page (@hive/shared
|
||||
// imports + shared typography/badges/
|
||||
// buttons/inbox/side-panel)
|
||||
// dist/static/dashboard.css /index.html only (dashboard-specific)
|
||||
// dist/static/flow.css /flow.html only (flow chrome + composer)
|
||||
// dist/static/logs.css /logs.html only (log viewer sub-tabs)
|
||||
//
|
||||
// Both JS entries inline `./common.js` (DOM helpers, Panel singleton,
|
||||
// NOTIF, path linkification) — esbuild dedupes the shared module
|
||||
|
|
@ -71,15 +75,19 @@ await build({
|
|||
logLevel: 'info',
|
||||
});
|
||||
|
||||
// Bundle the CSS — esbuild resolves @import including the package
|
||||
// re-exports from @hive/shared.
|
||||
await build({
|
||||
entryPoints: [src('dashboard.css')],
|
||||
outfile: staticDir('dashboard.css'),
|
||||
bundle: true,
|
||||
loader: { '.css': 'css' },
|
||||
logLevel: 'info',
|
||||
});
|
||||
// Bundle CSS — one entry per page. esbuild resolves @import including
|
||||
// the package re-exports from @hive/shared. Each page loads common.css
|
||||
// (shared typography, badges, buttons, inbox, side panel) plus its own
|
||||
// page-specific bundle.
|
||||
for (const entry of ['common.css', 'dashboard.css', 'flow.css', 'logs.css']) {
|
||||
await build({
|
||||
entryPoints: [src(entry)],
|
||||
outfile: staticDir(entry),
|
||||
bundle: true,
|
||||
loader: { '.css': 'css' },
|
||||
logLevel: 'info',
|
||||
});
|
||||
}
|
||||
|
||||
for (const html of ['index.html', 'flow.html', 'logs.html']) {
|
||||
copyFileSync(src(html), dist(html));
|
||||
|
|
|
|||
Loading…
Reference in a new issue