Minor: change adjustMenuPosition style to single side anchor and scale proportionally elsewhere (#1567)

src/components/actionbar/ComfyActionbar.vue

@@ -125,30 +125,45 @@ const adjustMenuPosition = () => {
     const menuWidth = panelRef.value.offsetWidth
     const menuHeight = panelRef.value.offsetHeight
 
-    // Calculate the distance from each edge
+    // Calculate distances to all edges
+    const distanceLeft = lastDragState.value.x
     const distanceRight =
       lastDragState.value.windowWidth - (lastDragState.value.x + menuWidth)
+    const distanceTop = lastDragState.value.y
     const distanceBottom =
       lastDragState.value.windowHeight - (lastDragState.value.y + menuHeight)
 
-    // Determine if the menu is closer to right/bottom or left/top
-    const anchorRight = distanceRight < lastDragState.value.x
-    const anchorBottom = distanceBottom < lastDragState.value.y
+    // Find the smallest distance to determine which edge to anchor to
+    const distances = [
+      { edge: 'left', distance: distanceLeft },
+      { edge: 'right', distance: distanceRight },
+      { edge: 'top', distance: distanceTop },
+      { edge: 'bottom', distance: distanceBottom }
+    ]
+    const closestEdge = distances.reduce((min, curr) =>
+      curr.distance < min.distance ? curr : min
+    )
 
-    // Calculate new position
-    if (anchorRight) {
-      x.value =
-        screenWidth - (lastDragState.value.windowWidth - lastDragState.value.x)
-    } else {
-      x.value = lastDragState.value.x
-    }
+    // Calculate vertical position as a percentage of screen height
+    const verticalRatio =
+      lastDragState.value.y / lastDragState.value.windowHeight
+    const horizontalRatio =
+      lastDragState.value.x / lastDragState.value.windowWidth
 
-    if (anchorBottom) {
-      y.value =
-        screenHeight -
-        (lastDragState.value.windowHeight - lastDragState.value.y)
+    // Apply positioning based on closest edge
+    if (closestEdge.edge === 'left') {
+      x.value = closestEdge.distance // Maintain exact distance from left
+      y.value = verticalRatio * screenHeight
+    } else if (closestEdge.edge === 'right') {
+      x.value = screenWidth - menuWidth - closestEdge.distance // Maintain exact distance from right
+      y.value = verticalRatio * screenHeight
+    } else if (closestEdge.edge === 'top') {
+      x.value = horizontalRatio * screenWidth
+      y.value = closestEdge.distance // Maintain exact distance from top
     } else {
-      y.value = lastDragState.value.y
+      // bottom
+      x.value = horizontalRatio * screenWidth
+      y.value = screenHeight - menuHeight - closestEdge.distance // Maintain exact distance from bottom
     }
 
     // Ensure the menu stays within the screen bounds