Fix mouse interactions in node visualizations (#12127)

Fixes #11215
Fixes #11748

Slightly adjusted styles to show mouse hover state on elements with click interactions.

<img width="168" alt="image" src="https://github.com/user-attachments/assets/452652f4-5e16-4899-a466-90095cdd4e4c" />
<img width="443" alt="image" src="https://github.com/user-attachments/assets/450559fd-6bd3-4429-b8e4-080c4afa838a" />

Author: Frizi

app/gui/src/project-view/components/GraphEditor/GraphNode.vue

@@ -472,6 +472,7 @@ const showMenuAt = ref<{ x: number; y: number }>()
     :style="nodeStyle"
     :class="nodeClass"
     :data-node-id="nodeId"
+    @pointerdown.stop
     @pointerenter="((nodeHovered = true), updateNodeHover($event))"
     @pointerleave="((nodeHovered = false), updateNodeHover(undefined))"
     @pointermove="updateNodeHover"

app/gui/src/project-view/components/visualizations/JSONVisualization/JsonObjectWidget.vue

@@ -73,7 +73,10 @@ function entryTitle(key: string) {
 }
 .key {
   color: blue;
-  text-decoration: underline;
+
+  &:hover {
+    text-decoration: underline;
+  }
 }
 .viewonly .key {
   color: darkred;

app/gui/src/project-view/components/visualizations/ScatterplotVisualization.vue

@@ -727,11 +727,12 @@ watchPostEffect(() => {
     })
     .transition()
     .duration(animationDuration.value)
+    .attr('class', 'scatterPoint')
     .attr(
       'd',
       symbol.type(matchShape).size((d) => (d.size ?? 0.15) * SIZE_SCALE_MULTIPLER),
     )
-    .style('fill', (d) => colorScale(d))
+    .style('--color', (d) => colorScale(d))
     .attr('transform', (d) => `translate(${xScale_(Number(d.x))}, ${yScale_(d.y)})`)
   if (data.value.points.labels === VISIBLE_POINTS) {
     d3Points.value
@@ -950,6 +951,16 @@ config.setToolbar(useScatterplotVizToolbar())
   user-select: none;
   display: flex;
   flex-direction: column;
+
+  &:deep(path.scatterPoint) {
+    fill: var(--color);
+    stroke: transparent;
+    stroke-width: 5px;
+    transition: stroke 200ms;
+    &:hover {
+      stroke: color-mix(in srgb, var(--color) 50%, transparent 50%);
+    }
+  }
 }
 
 .WarningsScatterplotVisualization {