Features Floating Vue Overrides

import FloatingVue from 'floating-vue'
import 'floating-vue/dist/style.css'

app.use(FloatingVue, {
  overflowPadding: 20,
})

.v-popper--theme-dropdown .v-popper__inner,
.v-popper--theme-tooltip .v-popper__inner {
  @apply bg-tooltip color-base font-sans rounded border border-base shadow dark:shadow-2xl;
  box-shadow: 0 6px 30px #0000001a;
}

.v-popper--theme-tooltip .v-popper__inner {
  @apply text-sm;
}

.v-popper--theme-tooltip {
  max-width: 20rem;
}

.v-popper--theme-tooltip .v-popper__arrow-inner,
.v-popper--theme-dropdown .v-popper__arrow-inner {
  visibility: visible;
  @apply border-white dark:border-#111;
}

.v-popper--theme-tooltip .v-popper__arrow-outer,
.v-popper--theme-dropdown .v-popper__arrow-outer {
  @apply border-base;
}

.v-popper--theme-tooltip.v-popper--shown,
.v-popper--theme-tooltip.v-popper--shown * {
  transition: none !important;
}

<div class="bg-tooltip color-base border border-base rounded shadow text-sm">
  tooltip content
</div>