diff --git a/airflow-core/src/airflow/ui/src/components/Graph/Edge.tsx b/airflow-core/src/airflow/ui/src/components/Graph/Edge.tsx index 156384d11384a..a337572797da0 100644 --- a/airflow-core/src/airflow/ui/src/components/Graph/Edge.tsx +++ b/airflow-core/src/airflow/ui/src/components/Graph/Edge.tsx @@ -27,7 +27,7 @@ import type { EdgeData } from "./reactflowUtils"; type Props = EdgeType; const CustomEdge = ({ data }: Props) => { - const [strokeColor] = useToken("colors", ["border.inverted"]); + const [strokeColor, blueColor] = useToken("colors", ["border.inverted", "blue.500"]); if (data === undefined) { return undefined; @@ -60,9 +60,9 @@ const CustomEdge = ({ data }: Props) => { point.x} y={(point: ElkPoint) => point.y} /> diff --git a/airflow-core/src/airflow/ui/src/components/Graph/TaskNode.tsx b/airflow-core/src/airflow/ui/src/components/Graph/TaskNode.tsx index 803a19959ea72..2674d32a953a7 100644 --- a/airflow-core/src/airflow/ui/src/components/Graph/TaskNode.tsx +++ b/airflow-core/src/airflow/ui/src/components/Graph/TaskNode.tsx @@ -75,7 +75,7 @@ export const TaskNode = ({ // Alternate background color for nested open groups bg={isOpen && depth !== undefined && depth % 2 === 0 ? "bg.muted" : "bg"} borderColor={ - taskInstance?.state ? `${taskInstance.state}.solid` : isSelected ? "border.inverted" : "border" + isSelected ? "blue.500" : taskInstance?.state ? `${taskInstance.state}.solid` : "border" } borderRadius={5} borderWidth={isSelected ? 4 : 2}