LBRYCommunity/spee.ch
1
0
Fork 0
Code Issues 95 Pull requests 2 Projects Releases 4 Packages Wiki Activity

Click to copy to work with entire div including icon

Browse source
This commit is contained in:
Minesh Mitha 2018-10-09 20:55:59 +01:00
parent 5f99629930
commit 57fab11316
2 changed files with 8 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
client/scss/click-to-copy/_click-to-copy.scss
View file

@ -2,8 +2,8 @@
display: flex; display: flex;
width: 100%; width: 100%;
justify-content: space-between; justify-content: space-between;
cursor: pointer;
.click-to-copy { .click-to-copy {
cursor: pointer;
border: none; border: none;
padding: 0.5em; padding: 0.5em;
margin: 0; margin: 0;

11
client/src/components/ClickToCopy/index.jsx
View file

@ -6,9 +6,10 @@ class ClickToCopy extends React.Component {
super(props); super(props);
this.copyToClipboard = this.copyToClipboard.bind(this); this.copyToClipboard = this.copyToClipboard.bind(this);
} }
copyToClipboard (event) { copyToClipboard () {
const elementToCopy = event.target.id; const elementToCopy = this.props.id;
const element = document.getElementById(elementToCopy); const element = document.getElementById(elementToCopy);
console.log(elementToCopy);
element.select(); element.select();
try { try {
document.execCommand('copy'); document.execCommand('copy');
@ -19,11 +20,13 @@ class ClickToCopy extends React.Component {
render () { render () {
const {id, value} = this.props; const {id, value} = this.props;
return ( return (
<div className='click-to-copy-wrap'> <div
className='click-to-copy-wrap'
onClick={this.copyToClipboard}
>
<input <input
id={id} id={id}
value={value} value={value}
onClick={this.copyToClipboard}
type='text' type='text'
className='click-to-copy' className='click-to-copy'
readOnly readOnly