Get rid of gradients
They were broke (
This commit is contained in:
@@ -7,33 +7,18 @@ interface ConnectionProps {
|
|||||||
toColor?: string;
|
toColor?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const Connection: React.FC<ConnectionProps> = ({ from, to, fromColor = '#a855f7', toColor = '#a855f7' }) => {
|
export const Connection: React.FC<ConnectionProps> = ({ from, to, fromColor, toColor }) => {
|
||||||
// Create a safe gradient ID by removing special characters
|
|
||||||
const gradientId = `gradient-${fromColor.replace(/[^a-zA-Z0-9]/g, '')}-${toColor.replace(/[^a-zA-Z0-9]/g, '')}`;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<g>
|
<g>
|
||||||
<defs>
|
|
||||||
<filter id="glow" x="-50%" y="-50%" width="200%" height="200%">
|
|
||||||
<feGaussianBlur stdDeviation="2" result="blur" />
|
|
||||||
<feComposite in="SourceGraphic" in2="blur" operator="over" />
|
|
||||||
</filter>
|
|
||||||
<linearGradient id={gradientId} x1="0%" y1="0%" x2="100%" y2="0%">
|
|
||||||
<stop offset="0%" stopColor={fromColor} stopOpacity="0.7" />
|
|
||||||
<stop offset="100%" stopColor={toColor} stopOpacity="0.7" />
|
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
|
||||||
|
|
||||||
{/* Glow effect */}
|
{/* Glow effect */}
|
||||||
<line
|
<line
|
||||||
x1={from.x}
|
x1={from.x}
|
||||||
y1={from.y}
|
y1={from.y}
|
||||||
x2={to.x}
|
x2={to.x}
|
||||||
y2={to.y}
|
y2={to.y}
|
||||||
stroke={`url(#${gradientId})`}
|
stroke={fromColor || "#a855f7"}
|
||||||
strokeWidth="3"
|
strokeWidth="3"
|
||||||
opacity="0.3"
|
opacity="0.3"
|
||||||
filter="url(#glow)"
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{/* Main line */}
|
{/* Main line */}
|
||||||
@@ -42,7 +27,7 @@ export const Connection: React.FC<ConnectionProps> = ({ from, to, fromColor = '#
|
|||||||
y1={from.y}
|
y1={from.y}
|
||||||
x2={to.x}
|
x2={to.x}
|
||||||
y2={to.y}
|
y2={to.y}
|
||||||
stroke={`url(#${gradientId})`}
|
stroke="#a855f7"
|
||||||
strokeWidth="1"
|
strokeWidth="1"
|
||||||
opacity="0.7"
|
opacity="0.7"
|
||||||
className="transition-all duration-300"
|
className="transition-all duration-300"
|
||||||
|
|||||||
Reference in New Issue
Block a user