mirrors/recipes
1
0
Fork 0
mirror of https://github.com/TandoorRecipes/recipes.git synced 2026-01-10 00:28:22 -05:00
Code Issues Packages Projects Releases Wiki Activity

nicer card working

Browse Source
This commit is contained in:
vabene1111
2023-02-16 20:38:40 +01:00
parent e754b13340
commit 3a38a095d8
2 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
vue/src/apps/RecipeSearchView/RecipeSearchView.vue
View File

@@ -832,7 +832,7 @@
<div class="row"> <div class="row">
<div class="col col-md-12"> <div class="col col-md-12">
<div <div
style="display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); grid-gap: 0.6rem; grid-auto-rows: max-content;"> style="display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); column-gap: 0.5rem;row-gap: 1rem; grid-auto-rows: max-content; ">
<template v-if="!searchFiltered()"> <template v-if="!searchFiltered()">
<recipe-card <recipe-card
v-bind:key="`mp_${m.id}`" v-bind:key="`mp_${m.id}`"

8
vue/src/components/RecipeCard.vue
View File

@@ -1,7 +1,7 @@
<template> <template>
<div> <div>
<template v-if="recipe && recipe.loading"> <template v-if="recipe && recipe.loading">
<b-card no-body v-hover> <b-card no-body v-hover style="height: 100%">
<b-card-img-lazy style="height: 15vh; object-fit: cover" class="" :src="placeholder_image" <b-card-img-lazy style="height: 15vh; object-fit: cover" class="" :src="placeholder_image"
v-bind:alt="$t('Recipe_Image')" top></b-card-img-lazy> v-bind:alt="$t('Recipe_Image')" top></b-card-img-lazy>
@@ -19,7 +19,7 @@
</b-card> </b-card>
</template> </template>
<template v-else> <template v-else>
<b-card no-body v-hover v-if="recipe"> <b-card no-body v-hover v-if="recipe" style="height: 100%">
<a :href="this.recipe.id !== undefined ? resolveDjangoUrl('view_recipe', this.recipe.id) : null"> <a :href="this.recipe.id !== undefined ? resolveDjangoUrl('view_recipe', this.recipe.id) : null">
<b-card-img-lazy style="height: 15vh; object-fit: cover" class="" :src="recipe_image" <b-card-img-lazy style="height: 15vh; object-fit: cover" class="" :src="recipe_image"
@@ -33,7 +33,7 @@
v-if="recipe !== null"></recipe-context-menu> v-if="recipe !== null"></recipe-context-menu>
</a> </a>
</div> </div>
<div class="card-img-overlay w-50 d-flex flex-column justify-content-left float-left text-left pt-2" <div class="card-img-overlay d-flex flex-column justify-content-left float-left text-left pt-2" style="width:40%"
v-if="recipe.working_time !== 0 || recipe.waiting_time !== 0"> v-if="recipe.working_time !== 0 || recipe.waiting_time !== 0">
<b-badge pill variant="light" class="mt-1 font-weight-normal" v-if="recipe.working_time !== 0"> <b-badge pill variant="light" class="mt-1 font-weight-normal" v-if="recipe.working_time !== 0">
<i <i
@@ -48,7 +48,7 @@
<b-card-body class="p-2 pl-3 pr-3"> <b-card-body class="p-2 pl-3 pr-3">
<span> <span>
<a :href="this.recipe.id !== undefined ? resolveDjangoUrl('view_recipe', this.recipe.id) : null" class="text-body two-row-text"> <a :href="this.recipe.id !== undefined ? resolveDjangoUrl('view_recipe', this.recipe.id) : null" class="text-body font-weight-bold two-row-text">
<template v-if="recipe !== null">{{ recipe.name }}</template> <template v-if="recipe !== null">{{ recipe.name }}</template>
<template v-else>{{ meal_plan.title }}</template> <template v-else>{{ meal_plan.title }}</template>
</a> </a>