input highlights
This commit is contained in:
@@ -33,6 +33,29 @@ body {
|
||||
box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.15);
|
||||
}
|
||||
|
||||
/* Connection validation: valid targets clearly highlighted (from drag start and when hovering), invalid dimmed while connecting */
|
||||
.react-flow__handle.react-flow__handle-connecting.react-flow__handle-valid,
|
||||
.react-flow__handle.connection-valid-target {
|
||||
background: hsl(var(--primary)) !important;
|
||||
color: hsl(var(--primary-foreground));
|
||||
box-shadow: 0 0 0 3px hsl(var(--primary)), 0 0 12px 2px hsl(var(--primary) / 0.5) !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
.react-flow__handle.react-flow__handle-connecting.react-flow__handle-valid svg,
|
||||
.react-flow__handle.connection-valid-target svg {
|
||||
color: inherit;
|
||||
}
|
||||
.dark .react-flow__handle.react-flow__handle-connecting.react-flow__handle-valid,
|
||||
.dark .react-flow__handle.connection-valid-target {
|
||||
background: hsl(var(--primary)) !important;
|
||||
box-shadow: 0 0 0 3px hsl(var(--primary)), 0 0 14px 4px hsl(var(--primary) / 0.6) !important;
|
||||
}
|
||||
.react-flow__handle.react-flow__handle-connecting:not(.react-flow__handle-valid):not(.connection-valid-target),
|
||||
.react-flow__handle.connection-invalid-target {
|
||||
opacity: 0.25 !important;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/* Animated React Flow edges: thicker stroke + path animation */
|
||||
.react-flow__edge path.animated-edge-path,
|
||||
.animated-edge-path {
|
||||
|
||||
Reference in New Issue
Block a user