diff --git a/lightrag_webui/src/components/graph/GraphControl.tsx b/lightrag_webui/src/components/graph/GraphControl.tsx index 55864789..a1477217 100644 --- a/lightrag_webui/src/components/graph/GraphControl.tsx +++ b/lightrag_webui/src/components/graph/GraphControl.tsx @@ -302,6 +302,10 @@ const GraphControl = ({ disableHoverEffect }: { disableHoverEffect?: boolean }) if (!disableHoverEffect) { const _focusedNode = focusedNode || selectedNode + // Choose edge highlight color based on theme + const edgeHighlightColor = isDarkTheme + ? Constants.edgeColorHighlightedDarkTheme + : Constants.edgeColorHighlightedLightTheme if (_focusedNode && graph.hasNode(_focusedNode)) { try { @@ -311,7 +315,7 @@ const GraphControl = ({ disableHoverEffect }: { disableHoverEffect?: boolean }) } } else { if (graph.extremities(edge).includes(_focusedNode)) { - newData.color = Constants.edgeColorHighlighted + newData.color = edgeHighlightColor } } } catch (error) { @@ -326,7 +330,7 @@ const GraphControl = ({ disableHoverEffect }: { disableHoverEffect?: boolean }) if (edge === _selectedEdge) { newData.color = Constants.edgeColorSelected } else if (edge === _focusedEdge) { - newData.color = Constants.edgeColorHighlighted + newData.color = edgeHighlightColor } else if (hideUnselectedEdges) { newData.hidden = true } diff --git a/lightrag_webui/src/lib/constants.ts b/lightrag_webui/src/lib/constants.ts index 798dc312..24fb6152 100644 --- a/lightrag_webui/src/lib/constants.ts +++ b/lightrag_webui/src/lib/constants.ts @@ -15,7 +15,8 @@ export const nodeBorderColorSelected = '#F57F17' export const edgeColorDarkTheme = '#888888' export const edgeColorSelected = '#F57F17' -export const edgeColorHighlighted = '#FFFFFF' +export const edgeColorHighlightedDarkTheme = '#F57F17' +export const edgeColorHighlightedLightTheme = '#F57F17' export const searchResultLimit = 50 export const labelListLimit = 100