Add box-shadow and z-index to chart tooltips for better visibility (#19)

Tooltip was blending with the legend labels at the bottom of the chart,
especially when showing all categories at once. Added shadow and z-index
to ensure the tooltip stands out from the background.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
medic-bot 2026-03-08 12:06:16 -04:00
parent c8b92517e8
commit 4923880a6e
2 changed files with 4 additions and 0 deletions

View file

@ -107,7 +107,9 @@ export default function CategoryBarChart({
border: "1px solid var(--border)", border: "1px solid var(--border)",
borderRadius: "8px", borderRadius: "8px",
color: "var(--foreground)", color: "var(--foreground)",
boxShadow: "0 4px 12px rgba(0,0,0,0.15)",
}} }}
wrapperStyle={{ zIndex: 50 }}
labelStyle={{ color: "var(--foreground)" }} labelStyle={{ color: "var(--foreground)" }}
itemStyle={{ color: "var(--foreground)" }} itemStyle={{ color: "var(--foreground)" }}
/> />

View file

@ -123,7 +123,9 @@ export default function CategoryOverTimeChart({
border: "1px solid var(--border)", border: "1px solid var(--border)",
borderRadius: "8px", borderRadius: "8px",
color: "var(--foreground)", color: "var(--foreground)",
boxShadow: "0 4px 12px rgba(0,0,0,0.15)",
}} }}
wrapperStyle={{ zIndex: 50 }}
labelStyle={{ color: "var(--foreground)" }} labelStyle={{ color: "var(--foreground)" }}
itemStyle={{ color: "var(--foreground)" }} itemStyle={{ color: "var(--foreground)" }}
filterNull filterNull