minor ui/ux improvements
This commit is contained in:
@ -54,7 +54,7 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col col-md-4 col-10">
|
||||
<div class="col col-md-4 col-10 mt-2 mt-md-0 mt-lg-0 mt-xl-0">
|
||||
<div class="row d-flex" style="padding-left: 16px">
|
||||
<div class="my-auto" style="padding-right: 4px">
|
||||
<i class="fas fa-pizza-slice fa-2x text-primary"></i>
|
||||
|
@ -22,9 +22,14 @@
|
||||
|
||||
<b-card-text style="text-overflow: ellipsis;">
|
||||
<template v-if="recipe !== null">
|
||||
<recipe-rating :recipe="recipe"></recipe-rating>
|
||||
<span v-if="recipe.description.length > 120">
|
||||
{{ recipe.description.substr(0, 120) + "\u2026" }}
|
||||
</span>
|
||||
<span v-if="recipe.description.length <= 120">
|
||||
{{ recipe.description }}
|
||||
|
||||
<recipe-rating :recipe="recipe"></recipe-rating> <br/> <!-- TODO UGLY! -->
|
||||
</span>
|
||||
<br/> <!-- TODO UGLY! -->
|
||||
<last-cooked :recipe="recipe"></last-cooked>
|
||||
<keywords :recipe="recipe" style="margin-top: 4px"></keywords>
|
||||
|
||||
|
@ -4,7 +4,7 @@
|
||||
<div class="dropdown d-print-none">
|
||||
<a class="btn shadow-none" href="#" role="button" id="dropdownMenuLink"
|
||||
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<i class="fas fa-ellipsis-v"></i>
|
||||
<i class="fas fa-ellipsis-v fa-lg"></i>
|
||||
</a>
|
||||
|
||||
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuLink">
|
||||
@ -37,9 +37,11 @@
|
||||
</button>
|
||||
</a>
|
||||
|
||||
<button class="dropdown-item" onclick="window.print()"><i
|
||||
class="fas fa-print fa-fw"></i> {{ $t('Print') }}
|
||||
</button>
|
||||
<a href="#">
|
||||
<button class="dropdown-item" onclick="window.print()"><i
|
||||
class="fas fa-print fa-fw"></i> {{ $t('Print') }}
|
||||
</button>
|
||||
</a>
|
||||
|
||||
<a class="dropdown-item" :href="resolveDjangoUrl('view_export') + '?r=' + recipe.id" target="_blank"
|
||||
rel="noopener noreferrer"><i class="fas fa-file-export fa-fw"></i> {{ $t('Export') }}</a>
|
||||
@ -60,11 +62,14 @@
|
||||
<b-modal :id="`modal-share-link_${modal_id}`" v-bind:title="$t('Share')" hide-footer>
|
||||
<div class="row">
|
||||
<div class="col col-md-12">
|
||||
<label v-if="recipe_share_link !== undefined">{{ $t('Link') }}</label>
|
||||
<label v-if="recipe_share_link !== undefined">{{ $t('Public share link') }}</label>
|
||||
<input ref="share_link_ref" class="form-control" v-model="recipe_share_link"/>
|
||||
<b-button class="mt-2 mb-3" variant="secondary" @click="$bvModal.hide(`modal-share-link_${modal_id}`)">{{ $t('Close') }}</b-button>
|
||||
<b-button class="mt-2 mb-3 ml-2" variant="primary" @click="copyShareLink()">{{ $t('Copy') }}</b-button>
|
||||
<b-button class="mt-2 mb-3 ml-2 float-right" variant="success" @click="shareIntend()">{{ $t('Share') }} <i class="fa fa-share-alt"></i></b-button>
|
||||
<b-button class="mt-2 mb-3 d-none d-md-inline" variant="secondary"
|
||||
@click="$bvModal.hide(`modal-share-link_${modal_id}`)">{{ $t('Close') }}
|
||||
</b-button>
|
||||
<b-button class="mt-2 mb-3 ml-md-2" variant="primary" @click="copyShareLink()">{{ $t('Copy') }}</b-button>
|
||||
<b-button class="mt-2 mb-3 ml-2 float-right" variant="success" @click="shareIntend()">{{ $t('Share') }} <i
|
||||
class="fa fa-share-alt"></i></b-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -128,7 +133,7 @@ export default {
|
||||
shareIntend: function () {
|
||||
let shareData = {
|
||||
title: this.recipe.name,
|
||||
text: this.$t('Check out this recipe!'),
|
||||
text: `${this.$t('Check out this recipe: ')} ${this.recipe.name}`,
|
||||
url: this.recipe_share_link
|
||||
}
|
||||
navigator.share(shareData)
|
||||
|
@ -1,9 +1,10 @@
|
||||
<template>
|
||||
<div>
|
||||
|
||||
<span style="display: inline-block;" v-if="recipe.rating > 0">
|
||||
<i class="fas fa-star fa-xs" v-for="i in Math.floor(recipe.rating)" v-bind:key="i"></i>
|
||||
<i class="fas fa-star-half-alt fa-xs" v-if="recipe.rating % 1 > 0"></i>
|
||||
<span class="d-inline" v-if="recipe.rating > 0">
|
||||
<i class="fas fa-star fa-xs text-primary" v-for="i in Math.floor(recipe.rating)" v-bind:key="i"></i>
|
||||
<i class="fas fa-star-half-alt fa-xs text-primary" v-if="recipe.rating % 1 > 0"></i>
|
||||
<i class="far fa-star fa-xs text-secondary" v-for="i in (5 - Math.ceil(recipe.rating))" v-bind:key="i + 10"></i>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
|
Reference in New Issue
Block a user