Watch
0
0
Fork
You've already forked hyperhive
0

dashboard: serve the dashboard at /, fold kept state in as a tab, add a pages menu

Drop the H0M3 tile hub and the core page. The dashboard is now the index;
kept state is its fifth tab. A pages menu in the chrome links flow, stats,
API docs and the swarm UI. The swarm apex URL comes from
services.hyperhive.swarm.domain via HIVE_SWARM_PUBLIC_URL and the new
swarm_public_url field of the state snapshot.
This commit is contained in:
iris 2026-10-16 14:03:31 +02:00 • committed by mara
commit 0622736b30
35 changed files with 661 additions and 986 deletions

View file

@ -3,9 +3,7 @@
component rules that this file depends on. */
/* SYST3M panel rules (rebuild queue / meta inputs / kept state)
live in system-sections.css, shared with /core.html. A few are still
referenced from the dashboard (`.rebuild-queue`), so the dashboard
pulls them in here. */
live in system-sections.css. */
@import "./system-sections.css";
@import "@hive/shared/jobq-rollup.css";
@import "@hive/shared/jobq-graph.css";
@ -29,7 +27,7 @@ body.dashboard-shell {
}
.dashboard-chrome {
/* Home back-link + tab strip share one row (flex). The chrome owns the
/* Pages menu + tab strip share one row (flex). The chrome owns the
horizontal gutter and the single full-width bottom divider; its
children drop their own side padding / border so they sit inline. */
display: flex;
@ -45,20 +43,64 @@ body.dashboard-shell {
padding: 0.3em 1em;
margin: 0 0 1em;
}
/* ← home back-link to the H0M3 hub. Small purple link top-left of the
chrome, mirroring the .page-back treatment the standalone pages use
(now shared from @hive/shared/chrome.css) so the navigation reads
consistently. The dashboard keeps this richer sticky chrome of its
own rather than folding into the simple page header. */
.dash-home-back {
/* Pages menu (links-menu.js): one icon button at the left of the chrome
that opens a popover of the standalone pages and the swarm UI. Same
shape as the swarm UI's LinksMenu — quiet until hovered or open. The
explicit `[hidden]` rule is needed because `display: flex` on the
popover would otherwise beat the UA `[hidden]` style. */
.links-menu {
position: relative;
flex: none;
}
.links-menu-button {
display: flex;
align-items: center;
justify-content: center;
width: 2em;
height: 2em;
padding: 0;
border: 1px solid transparent;
border-radius: 0.4em;
background: none;
color: var(--purple);
font-size: 1em;
line-height: 1;
cursor: pointer;
}
.links-menu-button:hover,
.links-menu-button[aria-expanded="true"] {
border-color: var(--border);
background: var(--bg-elev);
}
.links-menu-popover {
position: absolute;
top: calc(100% + 0.4em);
left: 0;
z-index: 10;
display: flex;
flex-direction: column;
min-width: 10em;
padding: 0.4em;
border: 1px solid var(--border);
border-radius: 0.5em;
background: var(--bg-elev);
box-shadow: 0 0.25em 0.75em rgba(0, 0, 0, 0.3);
}
.links-menu-popover[hidden] {
display: none;
}
.links-menu-item {
display: flex;
align-items: center;
gap: 0.5em;
padding: 0.4em 0.6em;
border-radius: 0.35em;
color: var(--fg);
text-decoration: none;
font-size: 0.82em;
white-space: nowrap;
}
.dash-home-back:hover {
text-decoration: underline;
.links-menu-item:hover {
background: var(--bg);
}
.banner-thin {
text-align: center;
@ -77,7 +119,7 @@ body.dashboard-shell {
flex-wrap: nowrap;
align-items: center;
gap: 0.2em;
/* On one row with the home link now; the chrome owns the gutter +
/* On one row with the pages menu; the chrome owns the gutter +
the bottom divider, so no outer padding / border here. */
}
/* Shares the flat-pill aesthetic of the shared `.hive-tab` (sub-tabs on