From f132c115c9a916a631efe93a676e51176ac8d222 Mon Sep 17 00:00:00 2001
From: Bryan Van Deusen <bryan.vandeusen@fabledsword.com>
Date: Thu, 19 Mar 2026 18:28:14 -0400
Subject: [PATCH] fix(ui): use div instead of button for WS status indicator

---
 frontend/src/App.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index b0ea18d..56d6571 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -32,15 +32,16 @@
       <v-spacer />
 
       <!-- WebSocket status indicator -->
-      <v-btn icon variant="text" style="cursor: default" :ripple="false">
+      <div class="d-flex align-center px-2">
         <v-icon
+          id="ws-status-icon"
           :color="wsStore.isConnected ? 'success' : 'error'"
           size="10"
         >mdi-circle</v-icon>
-        <v-tooltip activator="parent" location="bottom">
+        <v-tooltip activator="#ws-status-icon" location="bottom">
           {{ wsStore.isConnected ? 'Real-time updates active' : 'Disconnected — real-time updates paused' }}
         </v-tooltip>
-      </v-btn>
+      </div>
 
       <v-btn icon @click="toggleTheme">
         <v-icon>{{ isDark ? 'mdi-weather-sunny' : 'mdi-weather-night' }}</v-icon>