forked from profectus/Profectus
Fixed tooltips' classes and style props
This commit is contained in:
parent
8add09841e
commit
ba2bb3a5fd
1 changed files with 14 additions and 7 deletions
|
@ -1,11 +1,10 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
class="tooltip-container"
|
class="tooltip-container"
|
||||||
:class="{ shown: isShown, ...unref(classes) }"
|
:class="{ shown: isShown }"
|
||||||
@mouseenter="isHovered = true"
|
@mouseenter="isHovered = true"
|
||||||
@mouseleave="isHovered = false"
|
@mouseleave="isHovered = false"
|
||||||
@click.capture="togglePinned"
|
@click.capture="togglePinned"
|
||||||
:style="unref(style)"
|
|
||||||
>
|
>
|
||||||
<slot />
|
<slot />
|
||||||
<component v-if="elementComp" :is="elementComp" />
|
<component v-if="elementComp" :is="elementComp" />
|
||||||
|
@ -17,12 +16,16 @@
|
||||||
top: unref(direction) === TooltipDirection.UP,
|
top: unref(direction) === TooltipDirection.UP,
|
||||||
left: unref(direction) === TooltipDirection.LEFT,
|
left: unref(direction) === TooltipDirection.LEFT,
|
||||||
right: unref(direction) === TooltipDirection.RIGHT,
|
right: unref(direction) === TooltipDirection.RIGHT,
|
||||||
bottom: unref(direction) === TooltipDirection.DOWN
|
bottom: unref(direction) === TooltipDirection.DOWN,
|
||||||
|
...unref(classes)
|
||||||
}"
|
}"
|
||||||
:style="{
|
:style="[
|
||||||
|
{
|
||||||
'--xoffset': unref(xoffset) || '0px',
|
'--xoffset': unref(xoffset) || '0px',
|
||||||
'--yoffset': unref(yoffset) || '0px'
|
'--yoffset': unref(yoffset) || '0px'
|
||||||
}"
|
},
|
||||||
|
unref(style) ?? {}
|
||||||
|
]"
|
||||||
>
|
>
|
||||||
<span v-if="showPin" class="material-icons pinned">push_pin</span>
|
<span v-if="showPin" class="material-icons pinned">push_pin</span>
|
||||||
<component v-if="comp" :is="comp" />
|
<component v-if="comp" :is="comp" />
|
||||||
|
@ -142,6 +145,10 @@ export default defineComponent({
|
||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.tooltip :deep(hr) {
|
||||||
|
margin: var(--feature-margin) 0;
|
||||||
|
}
|
||||||
|
|
||||||
.shown {
|
.shown {
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue