m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

Switch to DIV for swaps dropdown accessibility (#9732)

Browse Source
This commit is contained in:
David Walsh 2020-10-27 12:20:35 -05:00 committed by GitHub
parent 3bbc1d1fa4
commit 61e48b4a84
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
ui/app/pages/swaps/dropdown-search-list/dropdown-search-list.js
View File

@ -61,11 +61,20 @@ export default function DropdownSearchList ({
} }
}, [externallySelectedItem, selectedItem, prevExternallySelectedItem]) }, [externallySelectedItem, selectedItem, prevExternallySelectedItem])
const onKeyUp = (e) => {
if (e.key === 'Escape') {
close()
} else if (e.key === 'Enter') {
onClickSelector(e)
}
}
return ( return (
<button <div
className={classnames('dropdown-search-list', className)} className={classnames('dropdown-search-list', className)}
onClick={onClickSelector} onClick={onClickSelector}
onKeyUp={(e) => e.key === 'Escape' && close()} onKeyUp={onKeyUp}
tabIndex="0"
> >
{!isOpen && ( {!isOpen && (
<div <div
@ -129,7 +138,7 @@ export default function DropdownSearchList ({
/> />
</> </>
)} )}
</button> </div>
) )
} }

5
ui/app/pages/swaps/dropdown-search-list/index.scss
View File

@ -1,9 +1,4 @@
.dropdown-search-list { .dropdown-search-list {
flex-flow: column;
border: none;
background: unset;
padding: 0;
&__search-list-open { &__search-list-open {
margin: 24px; margin: 24px;
box-shadow: none; box-shadow: none;