diff --git a/src/web/components/splitView.tsx b/src/web/components/splitView.tsx
index a976d152c7..14ef771599 100644
--- a/src/web/components/splitView.tsx
+++ b/src/web/components/splitView.tsx
@@ -24,7 +24,7 @@ export interface SplitViewProps {
   orientation?: 'vertical' | 'horizontal',
 }
 
-const kMinSidebarSize = 50;
+const kMinSize = 50;
 
 export const SplitView: React.FC<SplitViewProps> = ({
   sidebarSize,
@@ -33,7 +33,7 @@ export const SplitView: React.FC<SplitViewProps> = ({
   orientation = 'vertical',
   children
 }) => {
-  const [size, setSize] = React.useState<number>(Math.max(kMinSidebarSize, sidebarSize));
+  const [size, setSize] = React.useState<number>(Math.max(kMinSize, sidebarSize));
   const [resizing, setResizing] = React.useState<{ offset: number, size: number } | null>(null);
 
   const childrenArray = React.Children.toArray(children);
@@ -63,11 +63,13 @@ export const SplitView: React.FC<SplitViewProps> = ({
         if (!event.buttons) {
           setResizing(null);
         } else if (resizing) {
+          const offset = orientation === 'vertical' ? event.clientY : event.clientX;
+          const delta = offset - resizing.offset;
+          const newSize = sidebarIsFirst ? resizing.size + delta : resizing.size - delta;
+
           const splitView = (event.target as HTMLElement).parentElement!;
           const rect = splitView.getBoundingClientRect();
-          const clientOffset = orientation === 'vertical' ? event.clientY - rect.y : event.clientX - rect.x;
-          const resizingPosition = sidebarIsFirst ? clientOffset : resizing.size - clientOffset + resizing.offset;
-          const size = Math.min(Math.max(kMinSidebarSize, resizingPosition), (orientation === 'vertical' ? rect.height : rect.width) - kMinSidebarSize);
+          const size = Math.min(Math.max(kMinSize, newSize), (orientation === 'vertical' ? rect.height : rect.width) - kMinSize);
           setSize(size);
         }
       }}