Delete CopyButton.vue

This commit is contained in:
spiritlhl
2023-06-18 08:37:04 +08:00
committed by GitHub
parent 136f4ff473
commit 64790dc06d

View File

@@ -1,59 +0,0 @@
<template>
<button @click="copyCode" class="copy-button">
{{ copied ? 'Copied!' : 'Copy' }}
</button>
</template>
<script>
export default {
data() {
return {
copied: false,
};
},
methods: {
copyCode() {
const code = this.$parent.$el.querySelector('code').textContent;
navigator.clipboard.writeText(code)
.then(() => {
this.copied = true;
setTimeout(() => {
this.copied = false;
}, 1000);
})
.catch((error) => {
console.error('Failed to copy code:', error);
});
},
},
};
</script>
<style>
.copy-button {
background-color: #f0f0f0;
border: none;
border-radius: 4px;
color: #333;
cursor: pointer;
font-size: 14px;
padding: 4px 8px;
transition: background-color 0.3s;
}
.copy-button:hover {
background-color: #ddd;
}
.copy-button:active {
background-color: #bbb;
}
.copy-button:focus {
outline: none;
}
.copy-button.copied {
background-color: #aaf0aa;
}
</style>