Fixed tooltip position on client side component

This commit is contained in:
Alexis
2025-08-04 16:45:46 +02:00
parent 2199359b96
commit 9b8f48ad8e
2 changed files with 24 additions and 24 deletions

View File

@@ -6,14 +6,13 @@ const { isReadOnly } = storeToRefs(useCalendar())
</script> </script>
<template> <template>
<ClientOnly>
<UiTooltipProvider :delay-duration="250"> <UiTooltipProvider :delay-duration="250">
<UiTooltip> <UiTooltip>
<UiTooltipTrigger as-child> <UiTooltipTrigger as-child>
<ClientOnly>
<UiButton v-if="!isReadOnly" variant="secondary" size="icon" @click="toggleCategoriesModal(true)"> <UiButton v-if="!isReadOnly" variant="secondary" size="icon" @click="toggleCategoriesModal(true)">
<PhTag size="20" weight="light" /> <PhTag size="20" weight="light" />
</UiButton> </UiButton>
</ClientOnly>
</UiTooltipTrigger> </UiTooltipTrigger>
<UiTooltipContent> <UiTooltipContent>
<p> <p>
@@ -22,4 +21,5 @@ const { isReadOnly } = storeToRefs(useCalendar())
</UiTooltipContent> </UiTooltipContent>
</UiTooltip> </UiTooltip>
</UiTooltipProvider> </UiTooltipProvider>
</ClientOnly>
</template> </template>

View File

@@ -16,10 +16,10 @@ const breakpoints = useBreakpoints(
</script> </script>
<template> <template>
<ClientOnly>
<UiTooltipProvider :delay-duration="250"> <UiTooltipProvider :delay-duration="250">
<UiTooltip> <UiTooltip>
<UiTooltipTrigger as-child> <UiTooltipTrigger as-child>
<ClientOnly>
<UiButton <UiButton
:size="breakpoints.md.value ? 'default' : 'icon'" :size="breakpoints.md.value ? 'default' : 'icon'"
variant="secondary" variant="secondary"
@@ -31,11 +31,11 @@ const breakpoints = useBreakpoints(
{{ $t('entity.calendar.date.today') }} {{ $t('entity.calendar.date.today') }}
</span> </span>
</UiButton> </UiButton>
</ClientOnly>
</UiTooltipTrigger> </UiTooltipTrigger>
<UiTooltipContent> <UiTooltipContent>
<p>{{ defaultDateFormatted }}</p> <p>{{ defaultDateFormatted }}</p>
</UiTooltipContent> </UiTooltipContent>
</UiTooltip> </UiTooltip>
</UiTooltipProvider> </UiTooltipProvider>
</ClientOnly>
</template> </template>