From 5ef6a8b68335317144a0d2b3334e993d662b4b14 Mon Sep 17 00:00:00 2001
From: iris <iris@hyperhive.local>
Date: Tue, 9 Jun 2026 13:35:33 +0200
Subject: [PATCH] fix(frontend): put the dashboard home link and tab strip on
 one row (#1576)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

.dashboard-chrome was a plain block, so the inline-block home back-link
and the block-level .tabbar stacked on two separate rows. Make the chrome
a flex row (align-items: center) so the '← home' link and the tab strip
sit side by side. The chrome now owns the horizontal gutter and the
single full-width bottom divider; .dash-home-back and .tabbar drop their
own side padding / border accordingly. CSS-only — the markup already had
both as siblings of the chrome header.
---
 frontend/packages/dashboard/src/dashboard.css | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/frontend/packages/dashboard/src/dashboard.css b/frontend/packages/dashboard/src/dashboard.css
index 1c32848d..a0d0e04c 100644
--- a/frontend/packages/dashboard/src/dashboard.css
+++ b/frontend/packages/dashboard/src/dashboard.css
@@ -21,6 +21,12 @@ body.dashboard-shell {
 }
 
 .dashboard-chrome {
+  /* Home back-link + 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;
+  align-items: center;
+  gap: 0.75em;
   position: sticky;
   top: 0;
   z-index: 25;
@@ -28,7 +34,7 @@ body.dashboard-shell {
   -webkit-backdrop-filter: blur(8px) saturate(120%);
   backdrop-filter: blur(8px) saturate(120%);
   border-bottom: 1px solid var(--purple-dim);
-  padding: 0.4em 0 0;
+  padding: 0.3em 1em;
   margin: 0 0 1em;
 }
 /* ← home back-link to the H0M3 hub. Small purple link top-left of the
@@ -37,11 +43,10 @@ body.dashboard-shell {
    consistently. The dashboard keeps this richer sticky chrome of its
    own rather than folding into the simple page header. */
 .dash-home-back {
-  display: inline-block;
+  flex: none;
   color: var(--purple);
   text-decoration: none;
   font-size: 0.82em;
-  padding: 0.1em 1em 0;
   white-space: nowrap;
 }
 .dash-home-back:hover { text-decoration: underline; }
@@ -62,8 +67,8 @@ body.dashboard-shell {
   flex-wrap: nowrap;
   align-items: center;
   gap: 0.2em;
-  padding: 0.5em 1em;
-  border-bottom: 1px solid var(--purple-dim);
+  /* On one row with the home link now; 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
    the standalone pages) so the chrome reads as one family. Kept a touch