mirror of
https://github.com/TandoorRecipes/recipes.git
synced 2026-01-01 20:28:46 -05:00
quite nice
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div v-if="recipe.keywords.length > 0">
|
||||
<span :key="k.id" v-for="k in recipe.keywords.filter((kk) => { return kk.show || kk.show === undefined })" class="pl-1">
|
||||
<span :key="k.id" v-for="k in recipe.keywords.slice(0,keyword_splice).filter((kk) => { return kk.show || kk.show === undefined })" class="pl-1">
|
||||
<a :href="`${resolveDjangoUrl('view_search')}?keyword=${k.id}`"><b-badge pill variant="light"
|
||||
class="font-weight-normal">{{ k.label }}</b-badge></a>
|
||||
|
||||
@@ -17,6 +17,15 @@ export default {
|
||||
mixins: [ResolveUrlMixin],
|
||||
props: {
|
||||
recipe: Object,
|
||||
limit: Number,
|
||||
},
|
||||
computed: {
|
||||
keyword_splice: function (){
|
||||
if(this.limit){
|
||||
return this.limit
|
||||
}
|
||||
return this.recipe.keywords.lenght
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -46,21 +46,21 @@
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<b-card-body class="p-4">
|
||||
<h6>
|
||||
<a :href="this.recipe.id !== undefined ? resolveDjangoUrl('view_recipe', this.recipe.id) : null" class="text-body font-weight-bold">
|
||||
<b-card-body class="p-2 pl-3 pr-3">
|
||||
<span>
|
||||
<a :href="this.recipe.id !== undefined ? resolveDjangoUrl('view_recipe', this.recipe.id) : null" class="text-body two-row-text">
|
||||
<template v-if="recipe !== null">{{ recipe.name }}</template>
|
||||
<template v-else>{{ meal_plan.title }}</template>
|
||||
</a>
|
||||
</h6>
|
||||
</span>
|
||||
|
||||
<b-card-text style="text-overflow: ellipsis">
|
||||
<template v-if="recipe !== null">
|
||||
|
||||
|
||||
<p class="mt-1">
|
||||
<p class="mt-1 mb-1">
|
||||
<last-cooked :recipe="recipe"></last-cooked>
|
||||
<keywords-component :recipe="recipe"
|
||||
<keywords-component :recipe="recipe" :limit="3"
|
||||
style="margin-top: 4px; position: relative; z-index: 3;"></keywords-component>
|
||||
</p>
|
||||
<transition name="fade" mode="in-out">
|
||||
@@ -81,12 +81,11 @@
|
||||
|
||||
<b-badge pill variant="info" v-if="!recipe.internal">{{ $t("External") }}</b-badge>
|
||||
</template>
|
||||
<template v-else>{{ meal_plan.note }}</template>
|
||||
|
||||
</b-card-text>
|
||||
</b-card-body>
|
||||
|
||||
<b-card-footer v-if="footer_text !== undefined"><i v-bind:class="footer_icon"></i> {{ footer_text }}
|
||||
</b-card-footer>
|
||||
|
||||
</b-card>
|
||||
</template>
|
||||
|
||||
@@ -105,6 +104,11 @@
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<b-card-footer v-if="footer_text !== undefined"><i v-bind:class="footer_icon"></i> {{ footer_text }}
|
||||
</b-card-footer>
|
||||
|
||||
<template v-else>{{ meal_plan.note }}</template>
|
||||
|
||||
-->
|
||||
</template>
|
||||
|
||||
@@ -198,4 +202,13 @@ export default {
|
||||
{
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.two-row-text {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2; /* number of lines to show */
|
||||
line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user