fix: Page reloads in Firefox when clicking some menu items (#2060)

* fix: Some context menu items result in page reload in Firefox

closes #1877

* fix: Display of sidebar link actions on hover
This commit is contained in:
Tom Moor 2021-04-23 12:25:15 -07:00 committed by GitHub
parent eb6acdae20
commit 3b696cfa9a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -66,22 +66,24 @@ function SidebarLink({
}; };
return ( return (
<Link <>
$isActiveDrop={isActiveDrop} <Link
activeStyle={isActiveDrop ? activeDropStyle : activeStyle} $isActiveDrop={isActiveDrop}
style={active ? activeStyle : style} activeStyle={isActiveDrop ? activeDropStyle : activeStyle}
onClick={onClick} style={active ? activeStyle : style}
onMouseEnter={onMouseEnter} onClick={onClick}
exact={exact !== false} onMouseEnter={onMouseEnter}
to={to} exact={exact !== false}
as={to ? undefined : href ? "a" : "div"} to={to}
href={href} as={to ? undefined : href ? "a" : "div"}
className={className} href={href}
> className={className}
{icon && <IconWrapper>{icon}</IconWrapper>} >
<Label>{label}</Label> {icon && <IconWrapper>{icon}</IconWrapper>}
<Label>{label}</Label>
</Link>
{menu && <Actions showActions={showActions}>{menu}</Actions>} {menu && <Actions showActions={showActions}>{menu}</Actions>}
</Link> </>
); );
} }
@ -109,6 +111,8 @@ const Actions = styled(EventBoundary)`
} }
&:hover { &:hover {
display: inline-flex;
svg { svg {
opacity: 0.75; opacity: 0.75;
} }
@ -145,9 +149,8 @@ const Link = styled(NavLink)`
background: ${(props) => props.theme.black05}; background: ${(props) => props.theme.black05};
} }
&:hover, &:hover + ${Actions},
&:active { &:active + ${Actions} {
> ${Actions} {
display: inline-flex; display: inline-flex;
svg { svg {