github/mealie
1
0
Fork 0
mirror of https://github.com/hay-kot/mealie.git synced 2025-08-22 22:43:34 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 15

fix recipe scale tooltip showing also on other parts of the component

Browse source
This commit is contained in:
Kuchenpirat 2025-06-02 16:12:43 +00:00
commit 0c6046f829
2 changed files with 34 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

20
frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageScale.vue
View file

@ -1,21 +1,11 @@
<template>
<div class="d-flex justify-space-between align-center pt-2 pb-3">
<v-tooltip
<RecipeScaleEditButton
v-if="!isEditMode"
size="small"
top
color="secondary-darken-1"
>
<template #activator="{ props }">
<RecipeScaleEditButton
v-model.number="scaleValue"
v-bind="props"
:recipe-servings="recipeServings"
:edit-scale="!recipe.settings.disableAmount && !isEditMode"
/>
</template>
<span> {{ $t("recipe.edit-scale") }} </span>
</v-tooltip>
v-model.number="scaleValue"
:recipe-servings="recipeServings"
:edit-scale="!recipe.settings.disableAmount && !isEditMode"
/>
</div>
</template>

29
frontend/components/Domain/Recipe/RecipeScaleEditButton.vue
View file

@ -11,7 +11,36 @@
:close-on-content-click="false"
>
<template #activator="{ props }">
<v-tooltip
v-if="canEditScale"
size="small"
top
color="secondary-darken-1"
>
<template #activator="{ props: tooltipProps }">
<v-card
class="pa-1 px-2"
dark
color="secondary-darken-1"
size="small"
v-bind="{ ...props, ...tooltipProps }"
:style="{ cursor: canEditScale ? '' : 'default' }"
>
<v-icon
v-if="canEditScale"
size="small"
class="mr-2"
>
{{ $globals.icons.edit }}
</v-icon>
<!-- eslint-disable-next-line vue/no-v-html -->
<span v-html="yieldDisplay" />
</v-card>
</template>
<span> {{ $t("recipe.edit-scale") }} </span>
</v-tooltip>
<v-card
v-else
class="pa-1 px-2"
dark
color="secondary-darken-1"