refinded look of connections in light mode
This commit is contained in:
@@ -109,6 +109,8 @@ Jede Edge bekommt einen `drop-shadow`-Filter entsprechend dem Quell-Node-Typ. Fa
|
|||||||
|
|
||||||
Compare-Node hat zusätzlich Handle-spezifische Farben (`left` → Blau, `right` → Smaragd).
|
Compare-Node hat zusätzlich Handle-spezifische Farben (`left` → Blau, `right` → Smaragd).
|
||||||
|
|
||||||
|
Im **Light Mode** wird der eigentliche Edge-`stroke` ebenfalls aus dieser Akzentfarbe abgeleitet und mit **50% Transparenz** gerendert (`rgba(..., 0.5)`), damit Linie und Glow farblich konsistent bleiben.
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
## Optimistic Updates & Local Persistence
|
## Optimistic Updates & Local Persistence
|
||||||
|
|||||||
@@ -153,6 +153,17 @@ function sourceGlowFilterForNodeType(
|
|||||||
return `drop-shadow(0 0 3px rgba(${r},${g},${b},0.42)) drop-shadow(0 0 7px rgba(${r},${g},${b},0.2))`;
|
return `drop-shadow(0 0 3px rgba(${r},${g},${b},0.42)) drop-shadow(0 0 7px rgba(${r},${g},${b},0.2))`;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function sourceEdgeStrokeForNodeType(
|
||||||
|
type: string | undefined,
|
||||||
|
colorMode: EdgeGlowColorMode,
|
||||||
|
): string | undefined {
|
||||||
|
if (colorMode !== "light" || !type) return undefined;
|
||||||
|
const rgb = SOURCE_NODE_GLOW_RGB[type];
|
||||||
|
if (!rgb) return undefined;
|
||||||
|
const [r, g, b] = rgb;
|
||||||
|
return `rgba(${r}, ${g}, ${b}, 0.5)`;
|
||||||
|
}
|
||||||
|
|
||||||
/** Wie convexEdgeToRF, setzt zusätzlich filter am Pfad nach Quell-Node-Typ. */
|
/** Wie convexEdgeToRF, setzt zusätzlich filter am Pfad nach Quell-Node-Typ. */
|
||||||
export function convexEdgeToRFWithSourceGlow(
|
export function convexEdgeToRFWithSourceGlow(
|
||||||
edge: Doc<"edges">,
|
edge: Doc<"edges">,
|
||||||
@@ -161,10 +172,16 @@ export function convexEdgeToRFWithSourceGlow(
|
|||||||
): RFEdge {
|
): RFEdge {
|
||||||
const base = convexEdgeToRF(edge);
|
const base = convexEdgeToRF(edge);
|
||||||
const filter = sourceGlowFilterForNodeType(sourceNodeType, colorMode);
|
const filter = sourceGlowFilterForNodeType(sourceNodeType, colorMode);
|
||||||
if (!filter) return base;
|
const stroke = sourceEdgeStrokeForNodeType(sourceNodeType, colorMode);
|
||||||
|
if (!filter && !stroke) return base;
|
||||||
|
|
||||||
|
const style: NonNullable<RFEdge["style"]> = { ...(base.style ?? {}) };
|
||||||
|
if (filter) style.filter = filter;
|
||||||
|
if (stroke) style.stroke = stroke;
|
||||||
|
|
||||||
return {
|
return {
|
||||||
...base,
|
...base,
|
||||||
style: { ...(base.style ?? {}), filter },
|
style,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user