properly animate the profile hover card (#3590)

* properly implement with `isOpen` and `isPositioned` * well, this works just as well * add `willChange`
bluesky-social · Apr 17, 2024 · d598289 · d598289
1 parent 480fa10
commit d598289
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/src/components/ProfileHoverCard/index.web.tsx b/src/components/ProfileHoverCard/index.web.tsx
@@ -289,12 +289,12 @@ export function ProfileHoverCardInner(props: ProfileHoverCardProps) {
       {props.children}
       {isVisible && (
         <Portal>
-          <div style={animationStyle}>
-            <div
-              ref={refs.setFloating}
-              style={floatingStyles}
-              onPointerEnter={onPointerEnterCard}
-              onPointerLeave={onPointerLeaveCard}>
+          <div
+            ref={refs.setFloating}
+            style={floatingStyles}
+            onPointerEnter={onPointerEnterCard}
+            onPointerLeave={onPointerLeaveCard}>
+            <div style={{willChange: 'transform', ...animationStyle}}>
               <Card did={props.did} hide={onPress} />
             </div>
           </div>