From 929e3a66d74203bb7e5a12f310c8a5e4b7d76ce9 Mon Sep 17 00:00:00 2001
From: Adam Shiervani <adam.shiervani@gmail.com>
Date: Thu, 10 Apr 2025 12:39:36 +0200
Subject: [PATCH] fix(ui): adjust layout and z-index for improved UI
 consistency in KvmIdRoute (#345)

---
 ui/src/routes/devices.$id.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/ui/src/routes/devices.$id.tsx b/ui/src/routes/devices.$id.tsx
index 70132f4..82bb542 100644
--- a/ui/src/routes/devices.$id.tsx
+++ b/ui/src/routes/devices.$id.tsx
@@ -785,6 +785,7 @@ export default function KvmIdRoute() {
             <button className="absolute top-0" tabIndex={-1} id="videoFocusTrap" />
           </div>
         </FocusTrap>
+
         <div className="grid h-full select-none grid-rows-headerBody">
           <DashboardNavbar
             primaryLinks={isOnDevice ? [] : [{ title: "Cloud Devices", to: "/devices" }]}
@@ -795,7 +796,7 @@ export default function KvmIdRoute() {
             kvmName={deviceName || "JetKVM Device"}
           />
 
-          <div className="relative z-50 flex h-full w-full overflow-hidden">
+          <div className="relative flex h-full w-full overflow-hidden">
             <WebRTCVideo />
             <div
               style={{ animationDuration: "500ms" }}
@@ -811,7 +812,7 @@ export default function KvmIdRoute() {
       </div>
 
       <div
-        className="isolate"
+        className="z-50"
         onKeyUp={e => e.stopPropagation()}
         onKeyDown={e => {
           e.stopPropagation();