From 076f9641c296c52eed558805937c122edafe0935 Mon Sep 17 00:00:00 2001
From: Fredrik Johansson <fredrik.johansson@intraphone.com>
Date: Thu, 25 Jun 2026 19:48:28 +0200
Subject: [PATCH] ui: clean up self entry in peer list

Replace bold duplicate-looking self row with dimmed name + small accent
"you" badge. Removes the ID (already shown in identity section at top).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 web/src/App.css                | 2 ++
 web/src/components/Sidebar.tsx | 4 ++--
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/web/src/App.css b/web/src/App.css
index 140f919..55ec4ef 100644
--- a/web/src/App.css
+++ b/web/src/App.css
@@ -64,6 +64,8 @@ details summary { color: var(--muted); font-size: 12px; cursor: pointer; }
 .sidebar-peers { gap: 0; }
 .peer-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
 .peer-row { display: flex; align-items: center; gap: 6px; padding: 4px 12px; }
+.peer-row-self { opacity: 0.7; }
+.peer-row-you { font-size: 10px; color: var(--accent); text-transform: uppercase; letter-spacing: 0.06em; margin-left: 2px; flex-shrink: 0; }
 .peer-row:hover { background: rgba(255,255,255,0.04); }
 .peer-row:hover .peer-row-actions { opacity: 1; }
 .peer-row-alias { font-size: 13px; font-weight: 500; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
diff --git a/web/src/components/Sidebar.tsx b/web/src/components/Sidebar.tsx
index 9468676..696c721 100644
--- a/web/src/components/Sidebar.tsx
+++ b/web/src/components/Sidebar.tsx
@@ -92,8 +92,8 @@ export function Sidebar() {
         {/* Self */}
         <div className="peer-row peer-row-self">
           <span className="peer-dot" style={{ background: 'var(--accent)' }} />
-          <span className="peer-row-alias" style={{ fontWeight: 700 }}>{displayAlias || '…'}</span>
-          <span className="peer-row-id">{displayId.slice(0, 8)}</span>
+          <span className="peer-row-alias">{displayAlias || '…'}</span>
+          <span className="peer-row-you">you</span>
         </div>
 
         {connectedPeers.length === 0 && (