Style: Remove currently non-functional collapsed slots (#6264)
## Summary Address request to remove confusing hover behavior in the collapsed state ## Review Focus Confirmed with Alex that it's okay to remove these now and add them back with the implementation instead of leaving them as decorative elements. Also fixes a bug where the slots _all_ revealed when a node was hovered. ## Screenshots (if applicable) <img width="769" height="376" alt="image" src="https://github.com/user-attachments/assets/ec0037af-fd2e-4855-b0e4-f994f9ef9a0b" /> ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-6264-Style-Remove-currently-non-functional-collapsed-slots-2976d73d36508191914def8889491e8e) by [Unito](https://www.unito.io) --------- Co-authored-by: github-actions <github-actions@github.com>
|
Before Width: | Height: | Size: 99 KiB After Width: | Height: | Size: 97 KiB |
|
Before Width: | Height: | Size: 61 KiB After Width: | Height: | Size: 60 KiB |
|
Before Width: | Height: | Size: 60 KiB After Width: | Height: | Size: 59 KiB |
|
Before Width: | Height: | Size: 84 KiB After Width: | Height: | Size: 84 KiB |
@@ -9,7 +9,7 @@
|
||||
:class="
|
||||
cn(
|
||||
'bg-node-component-surface',
|
||||
'lg-node absolute rounded-2xl touch-none flex flex-col group',
|
||||
'lg-node absolute rounded-2xl touch-none flex flex-col',
|
||||
'border-1 border-solid border-node-component-border',
|
||||
// hover (only when node should handle events)
|
||||
shouldHandleNodePointerEvents &&
|
||||
@@ -44,10 +44,6 @@
|
||||
@contextmenu="handleContextMenu"
|
||||
>
|
||||
<div class="flex items-center">
|
||||
<template v-if="isCollapsed">
|
||||
<SlotConnectionDot multi class="absolute left-0 -translate-x-1/2" />
|
||||
<SlotConnectionDot multi class="absolute right-0 translate-x-1/2" />
|
||||
</template>
|
||||
<NodeHeader
|
||||
:node-data="nodeData"
|
||||
:collapsed="isCollapsed"
|
||||
@@ -160,7 +156,6 @@ import NodeContent from './NodeContent.vue'
|
||||
import NodeHeader from './NodeHeader.vue'
|
||||
import NodeSlots from './NodeSlots.vue'
|
||||
import NodeWidgets from './NodeWidgets.vue'
|
||||
import SlotConnectionDot from './SlotConnectionDot.vue'
|
||||
|
||||
// Extended props for main node component
|
||||
interface LGraphNodeProps {
|
||||
|
||||
@@ -31,9 +31,9 @@ defineExpose({
|
||||
cn(
|
||||
'bg-slate-300 rounded-full',
|
||||
'transition-all duration-150',
|
||||
'cursor-crosshair',
|
||||
'border border-solid border-node-component-slot-dot-outline',
|
||||
'group-hover/slot:[--node-component-slot-dot-outline-opacity-mult:5] group-hover/slot:scale-125',
|
||||
!multi &&
|
||||
'cursor-crosshair group-hover/slot:[--node-component-slot-dot-outline-opacity-mult:5] group-hover/slot:scale-125',
|
||||
multi ? 'w-3 h-6' : 'size-3'
|
||||
)
|
||||
"
|
||||
|
||||