Fix slowly disappearing NUX element
Summary: This issue was reported in the dogfooding group. https://fb.prod.workplace.com/groups/748354712423318/permalink/759865114605611/ Reviewed By: jknoxville Differential Revision: D24918536 fbshipit-source-id: 7c353dfe1230fa98964216a35e9679a90f398e1d
This commit is contained in:
committed by
Facebook GitHub Bot
parent
7d29f84ae0
commit
ba541e76dc
@@ -104,7 +104,7 @@ export function NUX({
|
|||||||
}, [title, manager, pluginInstance]);
|
}, [title, manager, pluginInstance]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Badge
|
<UnanimatedBadge
|
||||||
count={
|
count={
|
||||||
isRead ? (
|
isRead ? (
|
||||||
0
|
0
|
||||||
@@ -130,10 +130,18 @@ export function NUX({
|
|||||||
)
|
)
|
||||||
}>
|
}>
|
||||||
{children}
|
{children}
|
||||||
</Badge>
|
</UnanimatedBadge>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// We force visibility of the badge to invisible if count has dropped,
|
||||||
|
// otherwise ANT will await animation end, which looks really awkard, see D24918536
|
||||||
|
const UnanimatedBadge = styled(Badge)(({count}) => ({
|
||||||
|
'.ant-scroll-number-custom-component': {
|
||||||
|
visibility: count === 0 ? 'hidden' : undefined,
|
||||||
|
},
|
||||||
|
}));
|
||||||
|
|
||||||
const pulse = keyframes({
|
const pulse = keyframes({
|
||||||
'0%': {
|
'0%': {
|
||||||
opacity: 0.2,
|
opacity: 0.2,
|
||||||
|
|||||||
Reference in New Issue
Block a user