39 lines
744 B
Vue
39 lines
744 B
Vue
<template>
|
|
<div style="position: relative">
|
|
<div @click="copy(content)" class="copy center"><UiIcon>content_copy</UiIcon></div>
|
|
<p class="code" v-text="content"></p>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
defineProps<{
|
|
content: string
|
|
}>()
|
|
|
|
function copy(content: string)
|
|
{
|
|
navigator.clipboard.writeText(content)
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.code {
|
|
font-family: "Roboto Mono", monospace;
|
|
font-optical-sizing: auto;
|
|
white-space: preserve;
|
|
tab-size: 2;
|
|
}
|
|
.copy {
|
|
height: 2rem;
|
|
width: 2rem;
|
|
position: absolute;
|
|
background-color: var(--primary-color);
|
|
right: 0;
|
|
border-radius: 0.25rem;
|
|
cursor: pointer;
|
|
user-select: none;
|
|
}
|
|
.copy * {
|
|
color: white;
|
|
}
|
|
</style> |