fix(core): sidebar scrollbar is coverd by resize handle (#8307)

close AF-1236

Author: CatsJuice

packages/frontend/component/src/components/resize-panel/resize-panel.css.ts

@@ -50,7 +50,7 @@ export const resizeHandleContainer = style({
   right: resizeHandleOffsetVar,
   top: resizeHandleVerticalPadding,
   bottom: resizeHandleVerticalPadding,
-  width: 16,
+  width: 8,
   zIndex: '1',
   transform: 'translateX(50%)',
   backgroundColor: 'transparent',

packages/frontend/core/src/components/app-sidebar/index.tsx

@@ -94,7 +94,7 @@ export function AppSidebar({ children }: PropsWithChildren) {
         onResizing={setResizing}
         onWidthChange={setWidth}
         className={navWrapperStyle}
-        resizeHandleOffset={clientBorder ? 8 : 0}
+        resizeHandleOffset={0}
         resizeHandleVerticalPadding={clientBorder ? 16 : 0}
         data-transparent
         data-open={open}

packages/frontend/core/src/modules/workbench/view/workbench-root.tsx

@@ -149,7 +149,7 @@ const WorkbenchSidebar = () => {
     <ResizePanel
       floating={floating}
       resizeHandlePos="left"
-      resizeHandleOffset={clientBorder ? 3.5 : 0}
+      resizeHandleOffset={0}
       width={width}
       resizing={resizing}
       onResizing={setResizing}