vinzenz/hyperhive
vinzenz/hyperhive
Watch
0
0
Fork
You've already forked hyperhive
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(dashboard): keep the logs ← home link + sub-tabs on one row

Browse source 
The /logs.html header puts a flex:1 sub-tab strip (`.logs-tabbar`) next
to the ← home back-link inside the flex `.page-header`. The strip is
itself a flex container, so its default `min-width: auto` keeps it at its
intrinsic content width and — without an explicit nowrap on the parent —
it gets pushed onto its own row under the back-link.

Mirror the working dashboard chrome (`.dashboard-chrome` / `.tabbar`,
which sets `flex-wrap: nowrap`): make `.page-header` explicitly nowrap and
give `.logs-tabbar` `min-width: 0` so it shrinks to share the row instead
of wrapping. Affects every standalone page that uses `.page-header`
(flow / logs / stats / settings); the nowrap is correct for all of them.
This commit is contained in:
iris 2026-06-10 19:28:29 +02:00 • committed by mara
commit b38c834182
2 changed files with 10 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

5
frontend/packages/dashboard/src/logs.css
View file

@ -9,9 +9,12 @@ body.logs-shell {
/* Base tab styling now lives in @hive/shared/tabs.css (.hive-tab*). The
logs strip only adds a layout delta: fill the header row next to the
← home back-link. */
← home back-link. `min-width: 0` lets this flex:1 nav shrink below its
intrinsic content width instead of being bumped onto its own row under
the back-link (the `.page-header` is explicitly nowrap; see chrome.css). */
.logs-tabbar {
flex: 1;
min-width: 0;
}
.logs-main {

6
frontend/packages/shared/src/chrome.css
View file

@ -23,6 +23,12 @@
backdrop-filter: blur(8px) saturate(120%);
border-bottom: 1px solid var(--purple-dim);
display: flex;
/* Keep the back-link + sub-tab nav on one row. Without an explicit
nowrap a flex:1 sub-tab strip (e.g. /logs.html's `.logs-tabbar`)
whose intrinsic min-content width can't shrink (default
`min-width: auto`) gets pushed onto its own line. The strip pairs
this with `min-width: 0` so it can shrink instead of wrapping. */
flex-wrap: nowrap;
align-items: center;
gap: 1.5em;
padding: 0.5em 1.5em;