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

Mobile Recipe Card

Browse source
This commit is contained in:
Kuchenpirat 2025-07-30 12:39:39 +00:00
commit c7ab989257
1 changed files with 38 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

96
frontend/components/Domain/Recipe/RecipeCardMobile.vue
View file

@ -126,7 +126,7 @@
</div> </div>
</template> </template>
<script lang="ts"> <script setup lang="ts">
import RecipeFavoriteBadge from "./RecipeFavoriteBadge.vue"; import RecipeFavoriteBadge from "./RecipeFavoriteBadge.vue";
import RecipeContextMenu from "./RecipeContextMenu.vue"; import RecipeContextMenu from "./RecipeContextMenu.vue";
import RecipeCardImage from "./RecipeCardImage.vue"; import RecipeCardImage from "./RecipeCardImage.vue";
@ -134,63 +134,34 @@ import RecipeRating from "./RecipeRating.vue";
import RecipeChips from "./RecipeChips.vue"; import RecipeChips from "./RecipeChips.vue";
import { useLoggedInState } from "~/composables/use-logged-in-state"; import { useLoggedInState } from "~/composables/use-logged-in-state";
export default defineNuxtComponent({ interface Props {
components: { name: string;
RecipeFavoriteBadge, slug: string;
RecipeContextMenu, description: string;
RecipeRating, rating?: number;
RecipeCardImage, image?: string;
RecipeChips, tags?: Array<any>;
}, recipeId: string;
props: { vertical?: boolean;
name: { isFlat?: boolean;
type: String, height?: number;
required: true, disableHighlight?: boolean;
}, }
slug: { const props = withDefaults(defineProps<Props>(), {
type: String, rating: 0,
required: true, image: "abc123",
}, tags: () => [],
description: { vertical: false,
type: String, isFlat: false,
required: true, height: 150,
}, disableHighlight: false,
rating: { });
type: Number,
default: 0, defineEmits<{
}, selected: [];
image: { delete: [slug: string];
type: String, }>();
required: false,
default: "abc123",
},
tags: {
type: Array,
default: () => [],
},
recipeId: {
type: String,
required: true,
},
vertical: {
type: Boolean,
default: false,
},
isFlat: {
type: Boolean,
default: false,
},
height: {
type: [Number],
default: 150,
},
disableHighlight: {
type: Boolean,
default: false,
},
},
emits: ["selected", "delete"],
setup(props) {
const $auth = useMealieAuth(); const $auth = useMealieAuth();
const { isOwnGroup } = useLoggedInState(); const { isOwnGroup } = useLoggedInState();
@ -201,15 +172,6 @@ export default defineNuxtComponent({
return showRecipeContent.value ? `/g/${groupSlug.value}/r/${props.slug}` : ""; return showRecipeContent.value ? `/g/${groupSlug.value}/r/${props.slug}` : "";
}); });
const cursor = computed(() => showRecipeContent.value ? "pointer" : "auto"); const cursor = computed(() => showRecipeContent.value ? "pointer" : "auto");
return {
isOwnGroup,
recipeRoute,
showRecipeContent,
cursor,
};
},
});
</script> </script>
<style scoped> <style scoped>