diff --git a/src-tauri/tauri.macos.conf.json b/src-tauri/tauri.macos.conf.json
index 2394c5a..1c83dc7 100644
--- a/src-tauri/tauri.macos.conf.json
+++ b/src-tauri/tauri.macos.conf.json
@@ -15,7 +15,7 @@
       {
         "title": "Berry Dash Launcher",
         "width": 1000,
-        "height": 632,
+        "height": 600,
         "resizable": false,
         "maximizable": false,
         "titleBarStyle": "Overlay",
diff --git a/src/app/componets/Sidebar.tsx b/src/app/componets/Sidebar.tsx
index d8c32d9..8e88a0d 100644
--- a/src/app/componets/Sidebar.tsx
+++ b/src/app/componets/Sidebar.tsx
@@ -13,6 +13,7 @@ import {
 import { faDiscord } from '@fortawesome/free-brands-svg-icons'
 import { useState } from 'react'
 import { platform } from '@tauri-apps/plugin-os'
+import { getCurrentWindow } from '@tauri-apps/api/window'
 import { useGlobal } from '../GlobalProvider'
 import Image from 'next/image'
 import Link from 'next/link'
@@ -27,6 +28,23 @@ export default function Sidebar () {
 
   return (
     <aside className='sidebar'>
+      <div
+        className='dragarea'
+        style={{
+          height: '30px',
+          width: 'calc(var(--spacing) * 60)',
+          top: 0,
+          left: 0,
+          marginBottom: '-15px',
+          position: 'absolute',
+          zIndex: 9999,
+          display: platform() == 'macos' ? 'block' : 'none',
+          pointerEvents: 'auto'
+        }}
+        onMouseDown={() => {
+          getCurrentWindow().startDragging()
+        }}
+      ></div>
       <div className='logo'>
         <Image
           draggable={false}
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index c2ba05e..f4a0818 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -28,7 +28,6 @@ import axios from 'axios'
 import { openUrl } from '@tauri-apps/plugin-opener'
 import { GlobalProvider } from './GlobalProvider'
 import { Roboto } from 'next/font/google'
-import { getCurrentWindow } from '@tauri-apps/api/window'
 
 const roboto = Roboto({
   subsets: ['latin']
@@ -341,30 +340,10 @@ export default function RootLayout ({
                 >
                   <Sidebar />
                 </GlobalProvider>
-                <div
-                  className='dragarea'
-                  style={{
-                    height: '32px',
-                    width: '100vw',
-                    top: 0,
-                    left: 0,
-                    marginBottom: '-15px',
-                    position: 'absolute',
-                    zIndex: 9999,
-                    display: platform() == 'macos' ? 'block' : 'none',
-                    pointerEvents: 'auto'
-                  }}
-                  onMouseDown={() => {
-                    getCurrentWindow().startDragging()
-                  }}
-                ></div>
                 <div
                   className='relative z-[2] ml-[239px] w-[761px] border-b border-[#242424] h-[33px] bg-[#161616]'
                   style={{
-                    display:
-                      platform() == 'windows' || platform() == 'macos'
-                        ? 'block'
-                        : 'none'
+                    display: platform() == 'windows' ? 'block' : 'none'
                   }}
                 ></div>
                 <div className='relative z-0'>