diff --git a/src/App.js b/src/App.js index ce6cca9..b305e4d 100644 --- a/src/App.js +++ b/src/App.js @@ -313,8 +313,27 @@ class NotesCard extends React.Component { render() { return (
-
- {/* */} +
+ + { + // Reading and then appending new Clipboard text on top of it, else just overwriting Clipboard + let originalData = ""; + navigator.clipboard.readText() + .then((clipboardText) => { originalData = clipboardText; }) + .catch( (reason) => { + console.error("Clipboard Reading Issue- %s", reason); + }) + .finally(()=>{ + navigator.clipboard.writeText(originalData + '\n' + this.props.title + '\n' + this.props.detail).then(() => { + if (event && event.target) { + event.target.classList.replace("bi-clipboard-plus", "bi-clipboard-check"); + setTimeout( () => {event.target.classList.replace("bi-clipboard-check", "bi-clipboard-plus"); event.target.removeAttribute("disabled"); }, 1500 ); + } + }).catch( (reason) => { + console.error("Clipboard Writing Issue- %s", reason); + }) + }); + }}>
diff --git a/src/App.scss b/src/App.scss index 54dcb6c..de6e739 100644 --- a/src/App.scss +++ b/src/App.scss @@ -53,6 +53,12 @@ margin: .5em; background-color: unset; + .card-header.d-grid { + grid-auto-flow: column; + // justify-items: center; + grid-gap: 1em; + } + &:hover { transition: all 0.5s; box-shadow: 0 0 1px 2px burlywood;