Tooltip
Tooltip overflow
The Figma plugin modal behaves like it has a overflow: hidden CSS property, which means that every tooltip content that extends beyond the modal window, gets cut off. Set the position prop of the tooltip to accommodate for that.
Props
| Prop | Type | Default/Notes |
|---|---|---|
position | String | Default: bottom-center; Position of the tooltip. Accepts l, left, tl, top``-left, tc, top-center, tr, top-right, r, right, br, bottom-right, bc, bottom-center, bl, bottom-left |
width | Number | Default: undefined; Width of tooltip box |
inverse | Boolean | Default: false ; Inverses the color of the tooltip icon (tooltip content box stays the same) |
Example usage
<template>
<Tooltip position="bottom-left" width="200">Lorem Ipsum</Tooltip>
</template>
<script>
import { Tooltip } from 'figma-plugin-ds-vue'
export default {
components: {
Tooltip
}
}
</script>