Docker/mealie
Docker/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-07-24 15:49:42 +02:00
Code Issues Releases Activity

feat: Migrate to Nuxt 3 framework (#5184)

Browse source 
Co-authored-by: Michael Genson <71845777+michael-genson@users.noreply.github.com>
Co-authored-by: Kuchenpirat <24235032+Kuchenpirat@users.noreply.github.com>
This commit is contained in:
Hoa (Kyle) Trinh 2025-06-20 00:09:12 +07:00 • committed by GitHub
parent 89ab7fac25
commit c24d532608
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
403 changed files with 23959 additions and 19557 deletions
Download patch file Download diff file Expand all files Collapse all files

55
frontend/components/Domain/Recipe/RecipeIngredientListItem.vue
View file

@ -1,20 +1,38 @@
<template>
<div class="ma-0 pa-0 text-subtitle-1 dense-markdown ingredient-item">
<SafeMarkdown v-if="parsedIng.quantity" class="d-inline" :source="parsedIng.quantity" />
<template v-if="parsedIng.unit">{{ parsedIng.unit }} </template>
<SafeMarkdown v-if="parsedIng.note && !parsedIng.name" class="text-bold d-inline" :source="parsedIng.note" />
<SafeMarkdown
v-if="parsedIng.quantity"
class="d-inline"
:source="parsedIng.quantity"
/>
<template v-if="parsedIng.unit">
{{ parsedIng.unit }}
</template>
<SafeMarkdown
v-if="parsedIng.note && !parsedIng.name"
class="text-bold d-inline"
:source="parsedIng.note"
/>
<template v-else>
<SafeMarkdown v-if="parsedIng.name" class="text-bold d-inline" :source="parsedIng.name" />
<SafeMarkdown v-if="parsedIng.note" class="note" :source="parsedIng.note" />
<SafeMarkdown
v-if="parsedIng.name"
class="text-bold d-inline"
:source="parsedIng.name"
/>
<SafeMarkdown
v-if="parsedIng.note"
class="note"
:source="parsedIng.note"
/>
</template>
</div>
</template>
<script lang="ts">
import { computed, defineComponent } from "@nuxtjs/composition-api";
import { RecipeIngredient } from "~/lib/api/types/household";
import type { RecipeIngredient } from "~/lib/api/types/household";
import { useParsedIngredientText } from "~/composables/recipes";
export default defineComponent({
export default defineNuxtComponent({
props: {
ingredient: {
type: Object as () => RecipeIngredient,
@ -40,12 +58,20 @@ export default defineComponent({
},
});
</script>
<style lang="scss">
.ingredient-item {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.25em;
word-break: break-word;
min-width: 0;
.d-inline {
& > p {
display: inline;
&:has(>sub)>sup {
&:has(> sub) > sup {
letter-spacing: -0.05rem;
}
}
@ -55,7 +81,7 @@ export default defineComponent({
}
}
sup {
&+span{
& + span {
letter-spacing: -0.05rem;
}
&:before {
@ -66,12 +92,19 @@ export default defineComponent({
.text-bold {
font-weight: bold;
white-space: normal;
word-break: break-word;
}
}
.note {
line-height: 1.25em;
flex-basis: 100%;
width: 100%;
display: block;
line-height: 1.3em;
font-size: 0.8em;
opacity: 0.7;
white-space: normal;
word-break: break-word;
}
</style>