frontend: add <hive-tab-strip>, convert logs/credentials/core/builds tabbars
Every sub-page tabbar (logs.html, credentials.html, core.html,
builds.html) hand-wrote the same <nav class="hive-tabbar"><a
class="hive-tab">...</a></nav> boilerplate and then called
createTabStrip() on it after the fact. Add <hive-tab-strip>, a
markup-owning custom element (same reuse-boundary pattern as
<hive-menu>/<hive-side-panel>) that renders that markup from a
declarative tabs list, then wires the existing createTabStrip()
behaviour over what it just rendered — no behaviour duplication.
Convert all four sites to use it: each page's JS now calls
`.configure({ tabs, defaultId, onShow })` on the tabbar element instead
of `createTabStrip(el, opts)`, and configure() returns the identical
{ show, active } shape so nothing downstream changes. builds.js's
rebuild-queue count pill (builds-tab-count-rebuild) is expressed as a
tab's `badgeId` and renders nested in the same spot.
The dashboard's own tabbar and the two no-pane stats time-range
pickers are a different markup/behaviour shape and are intentionally
left alone.
This commit is contained in:
parent
44572d1e1a
commit
435ef193e1
10 changed files with 103 additions and 75 deletions
|
|
@ -16,7 +16,7 @@
|
|||
/core.html) carved out of the dashboard's old SYST3M tab so the
|
||||
dashboard tab strip stays lean. Same minimal chrome as
|
||||
/logs.html — a `← home` back-link to the H0M3 hub + a
|
||||
createTabStrip sub-tab nav. Three sub-tabs: kept state (tombstones),
|
||||
<hive-tab-strip> sub-tab nav. Three sub-tabs: kept state (tombstones),
|
||||
container load, and infra containers (start/stop/restart the four
|
||||
hive infra containers). Rebuild queue + meta inputs have moved to
|
||||
/builds.html (the build lifecycle hub). Default tab: K3PT ST4T3.
|
||||
|
|
@ -24,20 +24,8 @@
|
|||
infra-containers-section) match what core.js's renderers target. -->
|
||||
<header class="page-header">
|
||||
<a class="page-back" href="/">← home</a>
|
||||
<nav class="hive-tabbar core-tabbar" id="core-tabbar" role="tablist">
|
||||
<a class="hive-tab" id="core-tab-kept" href="#kept" role="tab"
|
||||
aria-controls="core-pane-kept" data-tab="kept">
|
||||
<span class="core-tab-label">K3PT ST4T3</span>
|
||||
</a>
|
||||
<a class="hive-tab" id="core-tab-load" href="#load" role="tab"
|
||||
aria-controls="core-pane-load" data-tab="load">
|
||||
<span class="core-tab-label">C0NT41N3R L04D</span>
|
||||
</a>
|
||||
<a class="hive-tab" id="core-tab-infra" href="#infra" role="tab"
|
||||
aria-controls="core-pane-infra" data-tab="infra">
|
||||
<span class="core-tab-label">1NFR4</span>
|
||||
</a>
|
||||
</nav>
|
||||
<hive-tab-strip class="hive-tabbar core-tabbar" id="core-tabbar" prefix="core"
|
||||
role="tablist"></hive-tab-strip>
|
||||
</header>
|
||||
|
||||
<main class="core-main">
|
||||
|
|
|
|||
Loading…
Reference in a new issue