fix: Show copy icon (#11847)

* Show copy icon

* Fix eslint

* Fix copy button on view query modal

* Remove comments
This commit is contained in:
Victor Malai 2020-12-02 09:40:02 +02:00 committed by GitHub
parent 618a73d56e
commit 07288789e2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 25 additions and 11 deletions

View File

@ -71,15 +71,11 @@ class CopyToClipboard extends React.Component {
} }
getDecoratedCopyNode() { getDecoratedCopyNode() {
return React.cloneElement( return React.cloneElement(this.props.copyNode, {
this.props.copyNode, style: { cursor: 'pointer' },
{ onClick: this.onClick,
style: { cursor: 'pointer' }, onMouseOut: this.onMouseOut,
onClick: this.onClick, });
onMouseOut: this.onMouseOut,
},
null,
);
} }
resetTooltipText() { resetTooltipText() {

View File

@ -75,6 +75,24 @@ const CopyButton = styled(Button)`
&& { && {
margin-left: ${({ theme }) => theme.gridUnit * 2}px; margin-left: ${({ theme }) => theme.gridUnit * 2}px;
} }
i {
padding: 0;
}
`;
const CopyButtonViewQuery = styled(Button)`
padding: ${({ theme }) => theme.gridUnit / 2}px
${({ theme }) => theme.gridUnit * 2.5}px;
font-size: ${({ theme }) => theme.typography.sizes.s}px;
&& {
margin-bottom: 5px;
}
i {
padding: 0;
}
`; `;
export const DisplayQueryButton = props => { export const DisplayQueryButton = props => {
@ -188,9 +206,9 @@ export const DisplayQueryButton = props => {
text={query} text={query}
shouldShowText={false} shouldShowText={false}
copyNode={ copyNode={
<Button style={{ position: 'absolute', right: 20 }}> <CopyButtonViewQuery>
<i className="fa fa-clipboard" /> <i className="fa fa-clipboard" />
</Button> </CopyButtonViewQuery>
} }
/> />
<SyntaxHighlighter language={language} style={github}> <SyntaxHighlighter language={language} style={github}>