From 0281229425c89cf5d2749ee6ac23f643c701dae5 Mon Sep 17 00:00:00 2001
From: Dorian <dorian@Dorians-MacBook-Air.local>
Date: Wed, 18 Mar 2026 18:41:35 +0000
Subject: [PATCH] fix: mesh mobile header hidden + DID hover on node names

- Mesh: remove display:flex from .mesh-header CSS that overrode
  Tailwind hidden class, causing title/peers to show on mobile
- Federation: add title={did} on node name for hover tooltip
- Cloud: add title={did} on peer name for hover tooltip
- Both already show node.name when available, DID as fallback

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 neode-ui/src/views/Cloud.vue      | 2 +-
 neode-ui/src/views/Federation.vue | 2 +-
 neode-ui/src/views/Mesh.vue       | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/neode-ui/src/views/Cloud.vue b/neode-ui/src/views/Cloud.vue
index 3ac7c61c..7aca5e81 100644
--- a/neode-ui/src/views/Cloud.vue
+++ b/neode-ui/src/views/Cloud.vue
@@ -64,7 +64,7 @@
             </svg>
           </div>
           <div class="flex-1 min-w-0">
-            <h3 class="text-lg font-semibold text-white mb-0.5 truncate">{{ peer.name || truncateDid(peer.did) }}</h3>
+            <h3 class="text-lg font-semibold text-white mb-0.5 truncate" :title="peer.did">{{ peer.name || truncateDid(peer.did) }}</h3>
             <p class="text-xs text-white/50 truncate">{{ peer.onion }}</p>
           </div>
           <svg class="w-5 h-5 text-white/30" fill="none" stroke="currentColor" viewBox="0 0 24 24">
diff --git a/neode-ui/src/views/Federation.vue b/neode-ui/src/views/Federation.vue
index b2e24285..69f60a49 100644
--- a/neode-ui/src/views/Federation.vue
+++ b/neode-ui/src/views/Federation.vue
@@ -162,7 +162,7 @@
           <div class="flex items-center justify-between mb-2">
             <div class="flex items-center gap-3 min-w-0">
               <div class="w-2.5 h-2.5 rounded-full shrink-0" :class="isOnline(node) ? 'bg-green-400' : 'bg-white/30'"></div>
-              <span class="text-sm font-medium text-white truncate">{{ node.name || shortDid(node.did) }}</span>
+              <span class="text-sm font-medium text-white truncate" :title="node.did">{{ node.name || shortDid(node.did) }}</span>
               <span
                 class="text-xs shrink-0"
                 :class="nodeTransportIcon(node.did).color"
diff --git a/neode-ui/src/views/Mesh.vue b/neode-ui/src/views/Mesh.vue
index 65585c5a..d9ac14b6 100644
--- a/neode-ui/src/views/Mesh.vue
+++ b/neode-ui/src/views/Mesh.vue
@@ -782,7 +782,7 @@ function truncatePubkey(hex: string | null): string {
 }
 
 .mesh-header {
-  display: flex;
+  /* display handled by Tailwind hidden md:flex */
   justify-content: space-between;
   align-items: center;
   gap: 16px;