From 2772f8016849f7f11897a6439f885b6da98ff362 Mon Sep 17 00:00:00 2001
From: Arturo Manzoli <arturomanzoli@gmail.com>
Date: Wed, 2 Oct 2024 08:44:56 -0300
Subject: [PATCH] Mini-widgets: Joystick-comm-indicator: Fix tooltip bug -
 breaking DOM

Signed-off-by: Arturo Manzoli <arturomanzoli@gmail.com>
---
 .../mini-widgets/JoystickCommIndicator.vue    | 22 +++++++++++--------
 1 file changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/components/mini-widgets/JoystickCommIndicator.vue b/src/components/mini-widgets/JoystickCommIndicator.vue
index 034f77439..74f35407c 100644
--- a/src/components/mini-widgets/JoystickCommIndicator.vue
+++ b/src/components/mini-widgets/JoystickCommIndicator.vue
@@ -1,14 +1,18 @@
 <template>
   <div>
-    <div v-tooltip="tooltipText" class="relative cursor-pointer" :class="indicatorClass" @click="showDialog = true">
-      <FontAwesomeIcon icon="fa-solid fa-gamepad" size="xl" />
-      <FontAwesomeIcon
-        v-if="!joystickConnected || !controllerStore.enableForwarding"
-        icon="fa-solid fa-slash"
-        size="xl"
-        class="absolute left-0"
-      />
-    </div>
+    <v-tooltip :text="tooltipText" location="bottom">
+      <template #activator="{ props: tooltipProps }">
+        <div v-bind="tooltipProps" class="relative cursor-pointer" :class="indicatorClass" @click="showDialog = true">
+          <FontAwesomeIcon icon="fa-solid fa-gamepad" size="xl" />
+          <FontAwesomeIcon
+            v-if="!joystickConnected || !controllerStore.enableForwarding"
+            icon="fa-solid fa-slash"
+            size="xl"
+            class="absolute left-0"
+          />
+        </div>
+      </template>
+    </v-tooltip>
 
     <InteractionDialog
       v-model="showDialog"