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:
parent
564d212148
commit
3251e30a2e
@ -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]} />
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user