Fix: tooltip on TOTALS row follows mouse cursor and renders above it

Co-Authored-By: Claude Sonnet 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Christian Vidal Wolf
2026-04-27 11:37:10 +02:00
co-authored by Claude Sonnet 4.6
parent 99e4b2c34b
commit 6ba07c60f6
+4 -7
View File
@@ -799,12 +799,9 @@ const WeeklyGrid: React.FC<WeeklyGridProps & { top50Mode: 'eu' | 'uk' }> = ({
const isHovered = hoveredTotalWeek === week;
return (
<th key={week} className="p-3 text-sm font-black text-white text-center border-r border-white/10 relative"
onMouseEnter={(e) => {
const rect = (e.currentTarget as HTMLElement).getBoundingClientRect();
setTooltipPos({ x: rect.left + rect.width / 2, y: rect.top });
setHoveredTotalWeek(week);
}}
<th key={week} className="p-3 text-sm font-black text-white text-center border-r border-white/10"
onMouseEnter={() => setHoveredTotalWeek(week)}
onMouseMove={(e) => setTooltipPos({ x: e.clientX, y: e.clientY })}
onMouseLeave={() => { setHoveredTotalWeek(null); setTooltipPos(null); }}
>
<div className="flex flex-col items-center">
@@ -839,7 +836,7 @@ const WeeklyGrid: React.FC<WeeklyGridProps & { top50Mode: 'eu' | 'uk' }> = ({
{isHovered && tooltipPos && (
<div className="pointer-events-none fixed z-[9999] w-64 bg-slate-900 border border-white/20 rounded-xl shadow-2xl p-3 text-left"
style={{ left: tooltipPos.x, top: tooltipPos.y - 8, transform: 'translate(-50%, -100%)' }}
style={{ left: tooltipPos.x + 16, top: tooltipPos.y - 16, transform: 'translateY(-100%)' }}
>
<div className="text-[10px] font-black text-white/50 uppercase tracking-widest mb-2">{week}</div>