fix: use direct hex color for correlation chart axis labels

CSS variable hsl(var(--muted-foreground)) doesn't resolve in SVG
context. Use #a1a1aa (zinc-400) directly for reliable visibility
on dark background.
This commit is contained in:
Joey Eamigh 2026-02-11 14:48:26 -05:00
parent 564d212148
commit 3251e30a2e
No known key found for this signature in database
GPG Key ID: CE8C05DFFC53C9CB

View File

@ -129,7 +129,7 @@ export function CorrelationChart({ data }: CorrelationChartProps) {
type="number"
dataKey="total_capacity_mw"
name="DC Capacity"
tick={{ fontSize: 11, fill: 'hsl(var(--muted-foreground))' }}
tick={{ fontSize: 11, fill: '#a1a1aa' }}
tickLine={false}
axisLine={false}
tickFormatter={(v: number) => `${v} MW`}>
@ -137,14 +137,14 @@ export function CorrelationChart({ data }: CorrelationChartProps) {
value="Total DC Capacity (MW)"
offset={-10}
position="insideBottom"
style={{ fontSize: 11, fill: 'hsl(var(--muted-foreground))' }}
style={{ fontSize: 11, fill: '#a1a1aa' }}
/>
</XAxis>
<YAxis
type="number"
dataKey="avg_price"
name="Avg Price"
tick={{ fontSize: 11, fill: 'hsl(var(--muted-foreground))' }}
tick={{ fontSize: 11, fill: '#a1a1aa' }}
tickLine={false}
axisLine={false}
tickFormatter={(v: number) => `$${v}`}>
@ -152,7 +152,7 @@ export function CorrelationChart({ data }: CorrelationChartProps) {
value="Avg Price ($/MWh)"
angle={-90}
position="insideLeft"
style={{ fontSize: 11, fill: 'hsl(var(--muted-foreground))' }}
style={{ fontSize: 11, fill: '#a1a1aa' }}
/>
</YAxis>
<ZAxis range={[200, 200]} />