dashboard: tab strip above banner-thin in chrome (#389)
Swap the order of `.tabbar` and `.banner` inside `.dashboard-chrome`
so the operator's navigation surface sits at the very top of the
sticky/fixed header — the "WE ARE THE WIRED" slug becomes decoration
below the tabs rather than chrome above them.
Applied to both `index.html` (sticky chrome) and `flow.html`
(fixed-overlay chrome).
No CSS changes — `.tabbar { border-bottom }` still divides tabs from
the area below (now the banner), and active-tab `margin-bottom: -1px`
still merges into that boundary cleanly.
This commit is contained in:
parent
d79b8a0a38
commit
91a72b5cbb
2 changed files with 10 additions and 9 deletions
|
|
@ -12,11 +12,10 @@
|
|||
(#383) — operator never has to navigate back to the dashboard
|
||||
to switch tabs. FL0W is the current page, the SW4RM / Y3R C4LL
|
||||
/ SYST3M tabs cross-link to the dashboard with the matching
|
||||
hash so the destination tab is pre-active. Banner-thin echoes
|
||||
the dashboard for visual continuity. -->
|
||||
hash so the destination tab is pre-active. Tab strip on top,
|
||||
banner-thin below (#389 — tabs are navigation, slug is
|
||||
decoration). -->
|
||||
<header class="dashboard-chrome flow-chrome" id="flow-header">
|
||||
<pre class="banner banner-thin">░▒▓█▓▒░ HYPERHIVE / HIVE-C0RE / WE ARE THE WIRED ░▒▓█▓▒░</pre>
|
||||
|
||||
<nav class="tabbar" id="tabbar" role="tablist">
|
||||
<a class="tab" href="/#swarm" role="tab" data-tab="swarm">
|
||||
<span class="tab-label">◆ SW4RM ◆</span>
|
||||
|
|
@ -47,6 +46,7 @@
|
|||
<span id="notif-status" class="meta" hidden></span>
|
||||
</div>
|
||||
</nav>
|
||||
<pre class="banner banner-thin">░▒▓█▓▒░ HYPERHIVE / HIVE-C0RE / WE ARE THE WIRED ░▒▓█▓▒░</pre>
|
||||
</header>
|
||||
|
||||
<!-- Operator inbox flyout trigger — count + click → side panel
|
||||
|
|
|
|||
|
|
@ -8,12 +8,12 @@
|
|||
</head>
|
||||
<body class="dashboard-shell">
|
||||
|
||||
<!-- Sticky chrome — banner + tab strip. Tabs route via the URL
|
||||
hash so F5 / back-button / shared links keep you on the same
|
||||
view. JS owns the actual show/hide; this is just the menu. -->
|
||||
<!-- Sticky chrome — tab strip on top, banner below (#389: tabs are
|
||||
the navigation surface, slug is decoration; tabs go first).
|
||||
Tabs route via the URL hash so F5 / back-button / shared links
|
||||
keep you on the same view. JS owns the actual show/hide; this
|
||||
is just the menu. -->
|
||||
<header class="dashboard-chrome">
|
||||
<pre class="banner banner-thin">░▒▓█▓▒░ HYPERHIVE / HIVE-C0RE / WE ARE THE WIRED ░▒▓█▓▒░</pre>
|
||||
|
||||
<nav class="tabbar" id="tabbar" role="tablist">
|
||||
<a class="tab" id="tab-swarm" href="#swarm" role="tab"
|
||||
aria-controls="tab-pane-swarm"
|
||||
|
|
@ -55,6 +55,7 @@
|
|||
<span id="notif-status" class="meta" hidden></span>
|
||||
</div>
|
||||
</nav>
|
||||
<pre class="banner banner-thin">░▒▓█▓▒░ HYPERHIVE / HIVE-C0RE / WE ARE THE WIRED ░▒▓█▓▒░</pre>
|
||||
</header>
|
||||
|
||||
<!-- Tab panes. Exactly one is `.tab-pane-active` at a time;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue