fix: replace InfoTooltip v-tooltip with v-menu popover card

v-tooltip renders a forced-dark background unsuitable for multi-line
help content. Switch to v-menu + v-card which follows the app theme.
Use surface-variant background for the "Tip:" block.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-04-14 22:41:01 +02:00
parent cc7cbbf29d
commit 1c6aed71fe
2 changed files with 25 additions and 12 deletions

View File

@@ -1,20 +1,30 @@
<template>
<VTooltip
location="bottom"
max-width="320"
open-on-click
<VMenu
:close-on-content-click="false"
location="bottom start"
max-width="340"
offset="8"
>
<template #activator="{ props: tooltipProps }">
<template #activator="{ props: menuProps }">
<VIcon
v-bind="tooltipProps"
v-bind="menuProps"
icon="tabler-info-circle"
size="16"
color="medium-emphasis"
class="cursor-help"
class="cursor-pointer"
/>
</template>
<div class="text-body-2">
<slot />
</div>
</VTooltip>
<VCard
variant="elevated"
class="pa-3"
>
<div
class="text-body-2"
style="line-height: 1.6;"
>
<slot />
</div>
</VCard>
</VMenu>
</template>