fix: smooth close animation — opacity fade on exit only, instant on open

This commit is contained in:
Usman Baig
2026-03-25 23:35:18 +01:00
parent df286ab0e4
commit d97eb77569

View File

@@ -376,8 +376,12 @@ export default function UnifiedSettingsModal() {
<AnimatePresence> <AnimatePresence>
{isOpen && ( {isOpen && (
<> <>
{/* Backdrop — no opacity animation to prevent chart flash through glass */} {/* Backdrop — instant appear, animated close */}
<div <motion.div
initial={{ opacity: 1 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0 }}
transition={{ duration: 0.15 }}
className="fixed inset-0 z-[60] bg-black/60 backdrop-blur-sm" className="fixed inset-0 z-[60] bg-black/60 backdrop-blur-sm"
onClick={handleBackdropClick} onClick={handleBackdropClick}
/> />
@@ -385,8 +389,8 @@ export default function UnifiedSettingsModal() {
{/* Modal */} {/* Modal */}
<motion.div <motion.div
initial={{ scale: 0.97, y: 8 }} initial={{ scale: 0.97, y: 8 }}
animate={{ scale: 1, y: 0 }} animate={{ opacity: 1, scale: 1, y: 0 }}
exit={{ scale: 0.97, y: 8 }} exit={{ opacity: 0, scale: 0.97, y: 8 }}
transition={{ type: 'spring', bounce: 0.15, duration: 0.35 }} transition={{ type: 'spring', bounce: 0.15, duration: 0.35 }}
className="fixed inset-0 z-[61] flex items-center justify-center p-4 pointer-events-none" className="fixed inset-0 z-[61] flex items-center justify-center p-4 pointer-events-none"
> >