mirror of
https://github.com/Codennnn/vue-color-avatar.git
synced 2024-12-22 20:22:39 +00:00
Update
This commit is contained in:
parent
60f5a4cb45
commit
c6ac2e169d
@ -113,7 +113,7 @@ async function make() {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
height: max(90vh, 1000px);
|
height: min(90vh, 1000px);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
background-color: lighten(var.$color-dark, 3);
|
background-color: lighten(var.$color-dark, 3);
|
||||||
border-radius: 1rem;
|
border-radius: 1rem;
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import ClipboardJS from 'clipboard'
|
import type ClipboardJS from 'clipboard'
|
||||||
import { computed, onMounted, onUnmounted, ref, watchEffect } from 'vue'
|
import { computed, onMounted, onUnmounted, ref, watchEffect } from 'vue'
|
||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
|
|
||||||
@ -66,7 +66,8 @@ const copied = ref(false)
|
|||||||
|
|
||||||
let clipboard: ClipboardJS
|
let clipboard: ClipboardJS
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(async () => {
|
||||||
|
const { default: ClipboardJS } = await import('clipboard')
|
||||||
clipboard = new ClipboardJS('#copy-code-btn')
|
clipboard = new ClipboardJS('#copy-code-btn')
|
||||||
|
|
||||||
clipboard.on('success', (e) => {
|
clipboard.on('success', (e) => {
|
||||||
@ -97,7 +98,7 @@ onUnmounted(() => {
|
|||||||
left: 50%;
|
left: 50%;
|
||||||
width: 75%;
|
width: 75%;
|
||||||
max-width: 800px;
|
max-width: 800px;
|
||||||
height: max(90vh, 1000px);
|
height: min(90vh, 1000px);
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: $code-header-height $code-box-side-padding-normal 2.5rem
|
padding: $code-header-height $code-box-side-padding-normal 2.5rem
|
||||||
$code-box-side-padding-normal;
|
$code-box-side-padding-normal;
|
||||||
|
@ -29,7 +29,7 @@ const emit = defineEmits<{
|
|||||||
.fade-enter-active,
|
.fade-enter-active,
|
||||||
.fade-leave-active {
|
.fade-leave-active {
|
||||||
@media (prefers-reduced-motion: no-preference) {
|
@media (prefers-reduced-motion: no-preference) {
|
||||||
transition: opacity 0.25s ease, transform 0.25s;
|
transition: opacity 0.25s ease, transform 0.2s;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user