mirror/hotomoe
1
0
Fork 0
mirror of https://github.com/hotomoe/hotomoe synced 2024-11-24 23:26:17 +09:00
Code

Update tooltip.vue

Browse Source
This commit is contained in:
syuilo 2021-10-24 14:39:24 +09:00
parent c08d959b59
commit 2b4d5b73b9
1 changed files with 9 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/client/components/ui/tooltip.vue
View File

@ -1,6 +1,6 @@
<template>
<transition name="tooltip" appear @after-leave="$emit('closed')">
<div class="buebdbiu _acrylic _shadow" v-show="showing" ref="content">
<div class="buebdbiu _acrylic _shadow" v-show="showing" ref="content" :style="{ maxWidth: maxWidth + 'px' }">
<slot>{{ text }}</slot>
</div>
</transition>
@ -21,7 +21,12 @@ export default defineComponent({
text: {
type: String,
required: false
}
},
maxWidth: {
type: Number,
required: false,
default: 250,
},
},
emits: ['closed'],
@ -75,11 +80,12 @@ export default defineComponent({
.buebdbiu {
position: absolute;
z-index: 11000;
max-width: 240px;
font-size: 0.8em;
padding: 8px 12px;
box-sizing: border-box;
text-align: center;
border-radius: 4px;
border: solid 0.5px var(--divider);
pointer-events: none;
transform-origin: center bottom;
}