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() {
return React.cloneElement(
this.props.copyNode,
{
style: { cursor: 'pointer' },
onClick: this.onClick,
onMouseOut: this.onMouseOut,
},
null,
);
return React.cloneElement(this.props.copyNode, {
style: { cursor: 'pointer' },
onClick: this.onClick,
onMouseOut: this.onMouseOut,
});
}
resetTooltipText() {

View File

@ -75,6 +75,24 @@ const CopyButton = styled(Button)`
&& {
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 => {
@ -188,9 +206,9 @@ export const DisplayQueryButton = props => {
text={query}
shouldShowText={false}
copyNode={
<Button style={{ position: 'absolute', right: 20 }}>
<CopyButtonViewQuery>
<i className="fa fa-clipboard" />
</Button>
</CopyButtonViewQuery>
}
/>
<SyntaxHighlighter language={language} style={github}>