fix(dashboard): use opaque background and readable text color on cost chart tooltips (#11960)

Fix de contraste no tooltip do gráfico de custos (fundo opaco + cor de texto legível). Mudança isolada de CSS/classe, validada no worktree combinado. Obrigado!
This commit is contained in:
ZaimMarzuki
2026-08-30 19:09:39 +07:00
committed by GitHub
parent 4c187de99b
commit 8f38dcd32b

View File

@@ -88,9 +88,11 @@ export function ProviderSpendCard({
<Tooltip
formatter={(value: number) => currencyFormatter.format(value || 0)}
contentStyle={{
background: "var(--surface)",
border: "1px solid rgba(255,255,255,0.1)",
borderRadius: "12px",
backgroundColor: "var(--color-surface)",
borderColor: "var(--color-border)",
borderRadius: 12,
color: "var(--color-text-main)",
boxShadow: "var(--shadow-soft)",
}}
/>
</PieChart>
@@ -158,9 +160,11 @@ export function CostTrendCard({
<Tooltip
formatter={(value: number) => currencyFormatter.format(value || 0)}
contentStyle={{
background: "var(--surface)",
border: "1px solid rgba(255,255,255,0.1)",
borderRadius: "12px",
backgroundColor: "var(--color-surface)",
borderColor: "var(--color-border)",
borderRadius: 12,
color: "var(--color-text-main)",
boxShadow: "var(--shadow-soft)",
}}
/>
<Line
@@ -224,9 +228,11 @@ export function WeeklyPatternCard({
`${new Intl.NumberFormat(locale).format(value || 0)} ${tokensLabel}`
}
contentStyle={{
background: "var(--surface)",
border: "1px solid rgba(255,255,255,0.1)",
borderRadius: "12px",
backgroundColor: "var(--color-surface)",
borderColor: "var(--color-border)",
borderRadius: 12,
color: "var(--color-text-main)",
boxShadow: "var(--shadow-soft)",
}}
/>
<Bar dataKey="tokens" fill="#8b5cf6" radius={[4, 4, 0, 0]} />