vcgit-forge/angular-challenges
1
0
Fork 0
mirror of https://github.com/Raghu-Ch/angular-challenges.git synced 2026-02-10 12:53:03 -05:00
Code Issues Packages Projects Releases Wiki Activity

feat(docs): use setTimeout instead of mouseleave event

Browse Source
This commit is contained in:
sagar
2023-11-22 20:44:05 +05:45
parent fa2f77752f
commit 884a34bbf3
1 changed files with 8 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
docs/src/components/ClipboardCopy.astro
View File

@@ -39,18 +39,20 @@ const { copyText } = Astro.props;
const commandCopyBtn = document.querySelector('.copy-button');
const copiedCheckMark = document.querySelector('.copied-checkmark');
const tooltipText = document.querySelector('.tooltipText');
const container = document.querySelector('.copy-container');
container.addEventListener('mouseleave', () => {
copiedCheckMark.style.display = 'none';
commandCopyBtn.style.display = 'inline-block';
tooltipText.innerHTML = 'Copy';
});
let timeout;
commandCopyBtn.addEventListener('click', () => {
navigator.clipboard.writeText(copyText);
tooltipText.innerHTML = 'Copied';
copiedCheckMark.style.display = 'inline-block';
commandCopyBtn.style.display = 'none';
//clear previous timeout
clearTimeout(timeout);
timeout = window.setTimeout(()=>{
copiedCheckMark.style.display = 'none';
commandCopyBtn.style.display = 'inline-block';
tooltipText.innerHTML = 'Copy';
}, 750)
});
</script>