clean up, add snackbar for copying code

This commit is contained in:
Will Freeman committed 2024-10-14 11:30:09 -05:00
1 parent f38bab1478
commit a152c1d692
2 files changed
+16 -2

No files matched your search

+15 -1
View File
@@ -6,6 +6,17 @@
<code ref="codeContent"> <code ref="codeContent">
<slot></slot> <slot></slot>
</code> </code>
<v-snackbar color="#0081ac" v-model="snackbarOpen" :timeout="3000">
Copied to clipboard!
<template v-slot:actions>
<v-btn
variant="text"
@click="snackbarOpen = false"
>
<v-icon>mdi-close</v-icon>
</v-btn>
</template>
</v-snackbar>
</div> </div>
</template> </template>
@@ -13,10 +24,13 @@
import { ref } from 'vue'; import { ref } from 'vue';
const codeContent = ref<HTMLElement | null>(null); const codeContent = ref<HTMLElement | null>(null);
const snackbarOpen = ref(false);
function copyToClipboard() { function copyToClipboard() {
if (codeContent.value) { if (codeContent.value) {
navigator.clipboard.writeText(codeContent.value.innerText); navigator.clipboard.writeText(codeContent.value.innerText)
.then(() => snackbarOpen.value = true)
.catch(() => console.error('Failed to copy to clipboard'));
} }
} }
</script> </script>
+1 -1
View File
@@ -1,6 +1,6 @@
<template> <template>
<v-sheet> <v-sheet>
<v-data-table density="compact" hide-default-footer disable-sort :items="kvTags" /> <v-data-table density="compact" hide-default-header hide-default-footer disable-sort :items="kvTags" />
</v-sheet> </v-sheet>
</template> </template>