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

ui/app/pages/swaps/actionable-message/actionable-message.js

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

ui/app/pages/swaps/actionable-message/index.scss

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