simplify card tile keyboard navigation

This commit is contained in:
btzr-io 2021-07-14 15:09:48 -05:00
parent 2f67ca370e
commit 6df622307c
3 changed files with 16 additions and 3 deletions

View file

@ -2044,5 +2044,16 @@
"The payment will be made from your saved card": "The payment will be made from your saved card", "The payment will be made from your saved card": "The payment will be made from your saved card",
"A channel is required to comment on lbry.tv": "A channel is required to comment on lbry.tv", "A channel is required to comment on lbry.tv": "A channel is required to comment on lbry.tv",
"Commenting...": "Commenting...", "Commenting...": "Commenting...",
"Trending for #Art": "Trending for #Art",
"Trending for #Education": "Trending for #Education",
"Trending for #Technology": "Trending for #Technology",
"Add to Watch Later": "Add to Watch Later",
"Remove from Watch Later": "Remove from Watch Later",
"Added": "Added",
"Show %count% replies": "Show %count% replies",
"Show reply": "Show reply",
"added to": "added to",
"removed from": "removed from",
"Item removed from Watch Later": "Item removed from Watch Later",
"--end--": "--end--" "--end--": "--end--"
} }

View file

@ -193,7 +193,7 @@ function ClaimPreviewTile(props: Props) {
'claim-preview__live': live, 'claim-preview__live': live,
})} })}
> >
<NavLink {...navLinkProps}> <NavLink aria-hidden tabindex={-1} {...navLinkProps}>
<FileThumbnail thumbnail={thumbnailUrl} allowGifs> <FileThumbnail thumbnail={thumbnailUrl} allowGifs>
{!isChannel && ( {!isChannel && (
<React.Fragment> <React.Fragment>
@ -245,7 +245,7 @@ function ClaimPreviewTile(props: Props) {
</div> </div>
) : ( ) : (
<React.Fragment> <React.Fragment>
<UriIndicator uri={uri} link hideAnonymous> <UriIndicator aria-hidden tabindex={-1} uri={uri} link hideAnonymous>
<ChannelThumbnail uri={channelUri} xsmall /> <ChannelThumbnail uri={channelUri} xsmall />
</UriIndicator> </UriIndicator>

View file

@ -48,6 +48,7 @@ class UriIndicator extends React.PureComponent<Props> {
hideAnonymous = false, hideAnonymous = false,
external = false, external = false,
className, className,
...props
} = this.props; } = this.props;
if (!claim) { if (!claim) {
@ -86,7 +87,7 @@ class UriIndicator extends React.PureComponent<Props> {
if (children) { if (children) {
return ( return (
<Button className={className} target={external ? '_blank' : undefined} navigate={channelLink}> <Button className={className} target={external ? '_blank' : undefined} navigate={channelLink} {...props}>
{children} {children}
</Button> </Button>
); );
@ -96,6 +97,7 @@ class UriIndicator extends React.PureComponent<Props> {
className={classnames(className, 'button--uri-indicator')} className={classnames(className, 'button--uri-indicator')}
navigate={channelLink} navigate={channelLink}
target={external ? '_blank' : undefined} target={external ? '_blank' : undefined}
{...props}
> >
{inner} {inner}
</Button> </Button>