diff --git a/src/components/Connection.tsx b/src/components/Connection.tsx index 2634a36..d7f427f 100644 --- a/src/components/Connection.tsx +++ b/src/components/Connection.tsx @@ -3,11 +3,10 @@ import React from 'react'; interface ConnectionProps { from: { x: number; y: number }; to: { x: number; y: number }; - fromColor?: string; - toColor?: string; + color?: string; } -export const Connection: React.FC = ({ from, to, fromColor, toColor }) => { +export const Connection: React.FC = ({ from, to, color }) => { return ( {/* Glow effect */} @@ -16,8 +15,8 @@ export const Connection: React.FC = ({ from, to, fromColor, toC y1={from.y} x2={to.x} y2={to.y} - stroke={fromColor || "#a855f7"} - strokeWidth="3" + stroke={color || "#a855f7"} + strokeWidth="5" opacity="0.3" /> @@ -27,7 +26,7 @@ export const Connection: React.FC = ({ from, to, fromColor, toC y1={from.y} x2={to.x} y2={to.y} - stroke={fromColor || "#a855f7"} + stroke={color || "#a855f7"} strokeWidth="1" opacity="0.7" className="transition-all duration-300" diff --git a/src/components/GalaxyMap.tsx b/src/components/GalaxyMap.tsx index 6379157..1f2b750 100644 --- a/src/components/GalaxyMap.tsx +++ b/src/components/GalaxyMap.tsx @@ -141,11 +141,11 @@ export const GalaxyMap = () => { return (
- +

Galaxy Map

Navigate the known regions of space

- +
{ - + - + {/* Render connections first (behind nodes) */} {regions?.map((region) => region.connectsTo?.map((connectedRegion) => { const fromPos = nodePositions[region.regionName]; const toPos = nodePositions[connectedRegion]; if (!fromPos || !toPos) return null; - + // Get colors for both regions - const fromColor = getSecurityColor(region.security); const toRegion = regions.find(r => r.regionName === connectedRegion); - const toColor = toRegion ? getSecurityColor(toRegion.security) : fromColor; - + const avgSecurity = (region.security + toRegion.security) / 2; + const color = getSecurityColor(avgSecurity); + return ( ); }) )} - - {/* Render nodes */} + + {/* Render fromCodes */} {regions?.map((region) => ( => { @@ -80,8 +79,7 @@ export const RegionMap: React.FC<{ regionName: string }> = ({ regionName }) => { key: connectionKey, from: fromPos, to: toPos, - fromColor: connectionColor, - toColor: connectionColor + color: connectionColor }); }); }); @@ -244,8 +242,7 @@ export const RegionMap: React.FC<{ regionName: string }> = ({ regionName }) => { key={connection.key} from={connection.from} to={connection.to} - fromColor={connection.fromColor} - toColor={connection.toColor} + color={connection.color} /> ))}