3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-05-27 16:06:59 +02:00
Code Issues Projects Releases Packages Wiki Activity

refactor(v2): make code blocks accessible from keyboard (#3649)

Browse source
This commit is contained in:
Alexey Pyltsyn 2020-10-28 19:51:21 +03:00 • committed by GitHub
parent 2aae77124e
commit 9f66545c8c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 13 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

24
packages/docusaurus-theme-classic/src/theme/CodeBlock/index.tsx
View file

@ -207,18 +207,9 @@ export default ({
</div>
)}
<div className={styles.codeBlockContent}>
<button
tabIndex={0}
ref={button}
type="button"
aria-label="Copy code to clipboard"
className={clsx(styles.copyButton, {
[styles.copyButtonWithTitle]: codeBlockTitle,
})}
onClick={handleCopyCode}>
{showCopied ? 'Copied' : 'Copy'}
</button>
<div
/* eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex */
tabIndex={0}
className={clsx(className, styles.codeBlock, {
[styles.codeBlockWithTitle]: codeBlockTitle,
})}>
@ -244,6 +235,17 @@ export default ({
})}
</div>
</div>
<button
ref={button}
type="button"
aria-label="Copy code to clipboard"
className={clsx(styles.copyButton, {
[styles.copyButtonWithTitle]: codeBlockTitle,
})}
onClick={handleCopyCode}>
{showCopied ? 'Copied' : 'Copy'}
</button>
</div>
</>
)}