sidebar position

packages/interface/src/components/file/Sidebar.tsx

@@ -41,28 +41,20 @@ const Heading: React.FC<{ children: React.ReactNode }> = ({ children }) => (
   <div className="mt-5 mb-1 ml-1 text-xs font-semibold text-gray-300">{children}</div>
 );
 
-export const MacOSTrafficLightsSpace: React.FC<{ children?: React.ReactNode }> = (props) => {
-  const { children } = props;
-
-  return (
-    <div data-tauri-drag-region className="h-7">
-      <div className="mt-2 mb-1 -ml-1 ">{children}</div>
-    </div>
-  );
-};
-
 export function MacOSTrafficLights() {
   const appPropsContext = useContext(AppPropsContext);
 
   return (
-    <MacOSTrafficLightsSpace>
-      <TrafficLights
-        onClose={appPropsContext?.onClose}
-        onFullscreen={appPropsContext?.onFullscreen}
-        onMinimize={appPropsContext?.onMinimize}
-        className="p-1.5 z-50 absolute"
-      />
-    </MacOSTrafficLightsSpace>
+    <div data-tauri-drag-region className="h-7">
+      <div className="mt-2 mb-1 -ml-1 ">
+        <TrafficLights
+          onClose={appPropsContext?.onClose}
+          onFullscreen={appPropsContext?.onFullscreen}
+          onMinimize={appPropsContext?.onMinimize}
+          className="p-1.5 z-50 absolute"
+        />
+      </div>
+    </div>
   );
 }
 
@@ -84,9 +76,11 @@ export const Sidebar: React.FC<SidebarProps> = (props) => {
   ];
 
   return (
-    <div className="flex flex-col flex-grow-0 flex-shrink-0 w-48 min-h-full px-3 overflow-x-hidden overflow-y-scroll border-r border-gray-100 no-scrollbar bg-gray-50 dark:bg-gray-850 dark:border-gray-600">
+    <div className="flex flex-col flex-grow-0 flex-shrink-0 w-48 min-h-full px-2.5 overflow-x-hidden overflow-y-scroll border-r border-gray-100 no-scrollbar bg-gray-50 dark:bg-gray-850 dark:border-gray-600">
       {appPropsContext?.platform === 'browser' ? <MacOSTrafficLights /> : null}
-      {appPropsContext?.platform === 'macOS' ? <MacOSTrafficLightsSpace /> : null}
+      {appPropsContext?.platform === 'macOS' ? (
+        <div data-tauri-drag-region className="h-[23px]" />
+      ) : null}
 
       <Dropdown
         buttonProps={{