fix(ui): make download button accessible via keyboard (#8974)

Refs #8881
swagger-api · Aug 16, 2023 · c90ef50 · c90ef50
1 parent 377b54a
commit c90ef50
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 7 deletions.
diff --git a/src/core/components/highlight-code.jsx b/src/core/components/highlight-code.jsx
@@ -45,18 +45,18 @@ const HighlightCode = ({value, fileName, className, downloadable, getConfigs, ca
 
   return (
     <div className="highlight-code" ref={rootRef}>
-      {!downloadable ? null :
-        <div className="download-contents" onClick={handleDownload}>
-          Download
-        </div>
-      }
-
       {canCopy && (
         <div className="copy-to-clipboard">
           <CopyToClipboard text={value}><button/></CopyToClipboard>
         </div>
       )}
 
+      {!downloadable ? null :
+        <button className="download-contents" onClick={handleDownload}>
+          Download
+        </button>
+      }
+
       {canSyntaxHighlight
         ? <SyntaxHighlighter
           language={language}

diff --git a/src/style/_layout.scss b/src/style/_layout.scss
@@ -745,10 +745,10 @@
   position: absolute;
   bottom: 10px;
   right: 10px;
-  cursor: pointer;
   background: #7d8293;
   text-align: center;
   padding: 5px;
+  border: none;
   border-radius: 4px;
   font-family: sans-serif;
   font-weight: 600;