CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-09-20 11:27:56 +12:00
Code Issues Projects Releases Wiki Activity

Switch TooltipWrapper to AbsTooltip. Messages were being truncated

Browse source
This commit is contained in:
Dean 2024-06-25 10:01:32 +01:00
parent d50a8e0746
commit 27917c78d1
1 changed files with 9 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
packages/bbui/src/Tooltip/TooltipWrapper.svelte
View file

@ -1,12 +1,10 @@
<script>
import Tooltip from "./Tooltip.svelte"
import Icon from "../Icon/Icon.svelte"
import AbsTooltip from "./AbsTooltip.svelte"
export let tooltip = ""
export let size = "M"
export let disabled = true
let showTooltip = false
</script>
<!-- svelte-ignore a11y-no-static-element-interactions -->
@ -14,20 +12,15 @@
<slot />
{#if tooltip}
<div class="icon-container">
<div
class="icon"
class:icon-small={size === "M" || size === "S"}
on:mouseover={() => (showTooltip = true)}
on:mouseleave={() => (showTooltip = false)}
on:focus
>
<Icon name="InfoOutline" size="S" {disabled} />
</div>
{#if showTooltip}
<div class="tooltip">
<Tooltip textWrapping={true} direction={"bottom"} text={tooltip} />
<AbsTooltip text={tooltip}>
<div
class="icon"
class:icon-small={size === "M" || size === "S"}
on:focus
>
<Icon name="InfoOutline" size="S" {disabled} hoverable />
</div>
{/if}
</AbsTooltip>
</div>
{/if}
</div>
@ -44,14 +37,6 @@
margin-left: 5px;
margin-right: 5px;
}
.tooltip {
position: absolute;
display: flex;
justify-content: center;
top: 15px;
z-index: 200;
width: 160px;
}
.icon {
transform: scale(0.75);
}