From a1e4442d3b691b84f20906831713036b6daab62c Mon Sep 17 00:00:00 2001
From: Christophe Besson <cbesson@gmail.com>
Date: Fri, 28 Aug 2026 10:15:51 +0200
Subject: fix(hub): sidebar — status dot on the name line, not between name and
 @owner
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The @owner line turned the sidebar name into a two-line block, and the
status dot (a flex sibling, align-items:center) floated to its vertical
middle. A group entry is now a flex column: dot+name on one row (.si-head),
@owner on a subordinate line indented past the dot. Non-group sidebar links
are untouched (.sidebar-item stays a row; only .sidebar-group flips).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_018gKJ85aZyvEwarXMFzFEwi
---
 packages/meshbay-hub/src/meshbay_hub/static/app.js | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

(limited to 'packages/meshbay-hub/src/meshbay_hub/static/app.js')

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/app.js b/packages/meshbay-hub/src/meshbay_hub/static/app.js
index 18f34fc..9a0787b 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/app.js
+++ b/packages/meshbay-hub/src/meshbay_hub/static/app.js
@@ -348,14 +348,16 @@ function Sidebar({ groups, presence, indexProgressPct, route, menuOpen, role, ha
               : t('presence.' + state);
             return html`
               <a key=${g.id}
-                 class="sidebar-item ${route === '/group/' + g.id ? 'active' : ''}"
+                 class="sidebar-item sidebar-group ${route === '/group/' + g.id ? 'active' : ''}"
                  href="#/group/${g.id}">
-                <span class="presence presence-${state}"
-                      title="${label}"
-                      aria-label="${label}"></span>
-                <span class="sidebar-item-name">
-                  <${GroupName} name=${g.name} owner=${g.owner_username} />
+                <span class="si-head">
+                  <span class="presence presence-${state}"
+                        title="${label}"
+                        aria-label="${label}"></span>
+                  <span class="sidebar-item-name">${g.name}</span>
                 </span>
+                ${g.owner_username && html`
+                  <span class="sidebar-owner">@${g.owner_username}</span>`}
               </a>
             `;
           })
-- 
cgit v1.2.3