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

Make action elements in actionable message component accessible (#10386)

* Make action elements in actionable message component accessible by making them buttons

* Remove unnecessary cursor pointer
This commit is contained in:
Dan J Miller 2021-02-05 14:57:48 -03:30 committed by GitHub
parent 33ab480fbe
commit 27d6c6e0df
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 6 deletions

View File

@ -41,7 +41,7 @@ export default function ActionableMessage({
{(primaryAction || secondaryAction) && ( {(primaryAction || secondaryAction) && (
<div className="actionable-message__actions"> <div className="actionable-message__actions">
{primaryAction && ( {primaryAction && (
<div <button
className={classnames( className={classnames(
'actionable-message__action', 'actionable-message__action',
'actionable-message__action--primary', 'actionable-message__action--primary',
@ -49,10 +49,10 @@ export default function ActionableMessage({
onClick={primaryAction.onClick} onClick={primaryAction.onClick}
> >
{primaryAction.label} {primaryAction.label}
</div> </button>
)} )}
{secondaryAction && ( {secondaryAction && (
<div <button
className={classnames( className={classnames(
'actionable-message__action', 'actionable-message__action',
'actionable-message__action--secondary', 'actionable-message__action--secondary',
@ -60,7 +60,7 @@ export default function ActionableMessage({
onClick={secondaryAction.onClick} onClick={secondaryAction.onClick}
> >
{secondaryAction.label} {secondaryAction.label}
</div> </button>
)} )}
</div> </div>
)} )}

View File

@ -27,7 +27,6 @@
&__action { &__action {
font-weight: bold; font-weight: bold;
cursor: pointer;
} }
&__info-tooltip-wrapper { &__info-tooltip-wrapper {
@ -83,7 +82,6 @@
.actionable-message__action { .actionable-message__action {
font-weight: normal; font-weight: normal;
cursor: pointer;
border-radius: 42px; border-radius: 42px;
min-width: 72px; min-width: 72px;
height: 18px; height: 18px;