color ratio fixed (#290)
Co-authored-by: Makhmudjon Inadullaev <makhmudjon@Makhmudjons-MacBook-Pro-2.local>
Makhmudjon Inadullaev committed
Nov 4, 2022 at 12:49 UTC
6f5d0c7945abb2925d58209fc8ef453bad7e3b80
1 file changed
+10
-3
theme/src/components/clipboard-copy.js
+10
-3
@@ -1,8 +1,15 @@
1
-import {Button, StyledOcticon} from '@primer/components'
1
+import {Button, StyledOcticon, themeGet} from '@primer/components'
2
import {CheckIcon, CopyIcon} from '@primer/octicons-react'
3
+import styled from 'styled-components'
4
import copy from 'copy-to-clipboard'
5
import React from 'react'
6
7
+const CopyToClipboard = styled(Button)`
8
+ &:focus {
9
+ box-shadow: 0 0 0 3px ${themeGet('colors.blue.5')};
10
+ }
11
+`
12
+
13
function ClipboardCopy({value}) {
14
const [copied, setCopied] = React.useState(false)
15
@@ -15,7 +22,7 @@ function ClipboardCopy({value}) {
22
}, [copied])
23
24
return (
18
- <Button
25
+ <CopyToClipboard
26
aria-label="Copy to clipboard"
27
onClick={() => {
28
copy(value)
@@ -23,7 +30,7 @@ function ClipboardCopy({value}) {
30
}}
31
>
32
{copied ? <StyledOcticon icon={CheckIcon} color="green.5" /> : <StyledOcticon icon={CopyIcon} color="gray.7" />}
26
- </Button>
33
+ </CopyToClipboard>
34
)
35
}
36