Align the workflow visualizer's nodes on the left (#9776)

**This PR implements a new layout for the visualizer, but the dimensions
of the nodes will change soon. I used hard-coded dimensions, like
`40px`, but I'll update them when I work on fixing the nodes' design. I
think we can merge this PR first and then fix the nodes' design.**



https://github.com/user-attachments/assets/580fa812-ee8e-4452-b6ac-ca55ecb31759

packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowDiagramBaseStepNode.tsx

@@ -76,9 +76,11 @@ const StyledSourceHandle = styled(Handle)`
   border: none;
   width: 4px;
   height: 4px;
+  left: ${({ theme }) => theme.spacing(10)};
 `;
 
 export const StyledTargetHandle = styled(Handle)`
+  left: ${({ theme }) => theme.spacing(10)};
   visibility: hidden;
 `;
 

packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowDiagramCreateStepNode.tsx

@@ -3,10 +3,13 @@ import { Handle, Position } from '@xyflow/react';
 import { IconButton, IconPlus } from 'twenty-ui';
 
 const StyledContainer = styled.div`
+  padding-left: ${({ theme }) => theme.spacing(6)};
   padding-top: ${({ theme }) => theme.spacing(1)};
+  position: relative;
 `;
 
 export const StyledTargetHandle = styled(Handle)`
+  left: ${({ theme }) => theme.spacing(10)};
   visibility: hidden;
 `;