fix: render check ying and check anna hover tooltips downwards to prevent header clipping

This commit is contained in:
Christian Vidal Wolf
2026-04-27 14:46:57 +02:00
parent 5e9ab45191
commit 557cb537a9
+3 -3
View File
@@ -1710,7 +1710,7 @@ export function PricingView({ data, headers, onSaveRow, onCaptureState, onEdit,
<tr <tr
key={dataIndex} key={dataIndex}
className={cn( className={cn(
'border-b border-slate-700/50 transition-colors', 'border-b border-slate-700/50 transition-colors group relative hover:z-50',
isValidated isValidated
? 'bg-green-400/30 border-l-4 border-l-green-400' // Vibrant high-visibility green ? 'bg-green-400/30 border-l-4 border-l-green-400' // Vibrant high-visibility green
: saveStatus === 'error' : saveStatus === 'error'
@@ -1941,7 +1941,7 @@ export function PricingView({ data, headers, onSaveRow, onCaptureState, onEdit,
<MessageSquare className={cn("w-3.5 h-3.5", note && "fill-amber-400/20")} /> <MessageSquare className={cn("w-3.5 h-3.5", note && "fill-amber-400/20")} />
</button> </button>
{note && ( {note && (
<div className="absolute bottom-full left-1/2 -translate-x-1/2 mb-2 w-48 p-2 bg-amber-900/90 border border-amber-500/50 rounded text-xs text-white shadow-lg z-50 opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none"> <div className="absolute top-full left-1/2 -translate-x-1/2 mt-2 w-48 p-2 bg-amber-900/90 border border-amber-500/50 rounded text-xs text-white shadow-lg z-[1000] opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none">
{note} {note}
</div> </div>
)} )}
@@ -1975,7 +1975,7 @@ export function PricingView({ data, headers, onSaveRow, onCaptureState, onEdit,
<MessageSquare className={cn("w-3.5 h-3.5", annaNote && "fill-pink-400/20")} /> <MessageSquare className={cn("w-3.5 h-3.5", annaNote && "fill-pink-400/20")} />
</button> </button>
{annaNote && ( {annaNote && (
<div className="absolute bottom-full left-1/2 -translate-x-1/2 mb-2 w-48 p-2 bg-pink-900/90 border border-pink-500/50 rounded text-xs text-white shadow-lg z-50 opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none"> <div className="absolute top-full left-1/2 -translate-x-1/2 mt-2 w-48 p-2 bg-pink-900/90 border border-pink-500/50 rounded text-xs text-white shadow-lg z-[1000] opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none">
{annaNote} {annaNote}
</div> </div>
)} )}