From 759d5c72578c57f4948b4e1e9b3da8fa33125ad8 Mon Sep 17 00:00:00 2001
From: Faisal Amir <urmauur@gmail.com>
Date: Fri, 16 May 2025 09:17:06 +0700
Subject: [PATCH] chore: increase hight of drag area window

---
 web-app/src/containers/DropdownModelProvider.tsx | 2 +-
 web-app/src/containers/HeaderPage.tsx            | 5 ++++-
 web-app/src/containers/LeftPanel.tsx             | 2 +-
 web-app/src/routes/__root.tsx                    | 2 +-
 web-app/src/routes/hub.tsx                       | 2 +-
 5 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/web-app/src/containers/DropdownModelProvider.tsx b/web-app/src/containers/DropdownModelProvider.tsx
index 90f4379f9..f7f3ebd48 100644
--- a/web-app/src/containers/DropdownModelProvider.tsx
+++ b/web-app/src/containers/DropdownModelProvider.tsx
@@ -54,7 +54,7 @@ const DropdownModelProvider = ({ model }: DropdownModelProviderProps) => {
   return (
     <DropdownMenu>
       <DropdownMenuTrigger asChild>
-        <button className="bg-main-view-fg/5 hover:bg-main-view-fg/8 px-2 py-1 rounded font-medium cursor-pointer flex items-center gap-1.5">
+        <button className="bg-main-view-fg/5 hover:bg-main-view-fg/8 px-2 py-1 rounded font-medium cursor-pointer flex items-center gap-1.5 relative z-20">
           <img
             src={getProviderLogo(selectedProvider as string)}
             alt={`${selectedProvider} - Logo`}
diff --git a/web-app/src/containers/HeaderPage.tsx b/web-app/src/containers/HeaderPage.tsx
index e81c9a9b0..3736b7ec2 100644
--- a/web-app/src/containers/HeaderPage.tsx
+++ b/web-app/src/containers/HeaderPage.tsx
@@ -24,7 +24,10 @@ const HeaderPage = ({ children }: HeaderPageProps) => {
             className="size-5 cursor-pointer flex items-center justify-center rounded hover:bg-main-view-fg/10 transition-all duration-200 ease-in-out data-[state=open]:bg-main-view-fg/10"
             onClick={() => setLeftPanel(!open)}
           >
-            <IconLayoutSidebar size={18} className="text-main-view-fg" />
+            <IconLayoutSidebar
+              size={18}
+              className="text-main-view-fg relative z-20"
+            />
           </button>
         )}
         {children}
diff --git a/web-app/src/containers/LeftPanel.tsx b/web-app/src/containers/LeftPanel.tsx
index a491a15ce..0748a5855 100644
--- a/web-app/src/containers/LeftPanel.tsx
+++ b/web-app/src/containers/LeftPanel.tsx
@@ -98,7 +98,7 @@ const LeftPanel = () => {
     >
       <div className="relative h-8">
         <button
-          className="absolute top-1/2 right-0 -translate-y-1/2"
+          className="absolute top-1/2 right-0 -translate-y-1/2 z-20"
           onClick={() => setLeftPanel(!open)}
         >
           <div className="size-6 cursor-pointer flex items-center justify-center rounded hover:bg-left-panel-fg/10 transition-all duration-200 ease-in-out">
diff --git a/web-app/src/routes/__root.tsx b/web-app/src/routes/__root.tsx
index e550a154a..666df1167 100644
--- a/web-app/src/routes/__root.tsx
+++ b/web-app/src/routes/__root.tsx
@@ -24,7 +24,7 @@ const AppLayout = () => {
       <KeyboardShortcutsProvider />
       <main className="relative h-svh text-sm antialiased select-none bg-app">
         {/* Fake absolute panel top to enable window drag */}
-        <div className="absolute w-full h-2 z-50" data-tauri-drag-region />
+        <div className="absolute w-full h-10 z-10" data-tauri-drag-region />
 
         <div className="flex h-full">
           {/* left content panel - only show if not logs route */}
diff --git a/web-app/src/routes/hub.tsx b/web-app/src/routes/hub.tsx
index c2bf9c9ae..ab0ecc3dd 100644
--- a/web-app/src/routes/hub.tsx
+++ b/web-app/src/routes/hub.tsx
@@ -79,7 +79,7 @@ function Hub() {
   return (
     <div className="flex h-full w-full">
       <div className="flex flex-col h-full w-full">
-        <div className="px-4 py-3 border-b border-main-view-fg/5 h-10 flex items-center justify-between">
+        <div className="px-4 py-3 border-b border-main-view-fg/5 h-10 flex items-center justify-between relative z-20">
           <div className="flex items-center gap-2">
             <IconSearch className="text-main-view-fg/60" size={14} />
             <input