Docker/mealie
Docker/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-07-19 05:09:40 +02:00
Code Issues Releases Activity

ux: unify UI based on user-feedback (#1216)

Browse source 
* unify UI based on user-feedback

* fix layout shify error

* implement drag and drop animation
This commit is contained in:
Hayden 2022-05-11 17:14:03 -08:00 • committed by GitHub
parent 8f1c082d79
commit 4fe19b88ca
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 282 additions and 194 deletions
Download patch file Download diff file Expand all files Collapse all files

26
frontend/components/Domain/Recipe/RecipeNotes.vue
View file

@ -1,29 +1,27 @@
<template>
<div v-if="value.length > 0 || edit">
<div v-if="value.length > 0 || edit" class="mt-8">
<h2 class="my-4">{{ $t("recipe.note") }}</h2>
<v-card v-for="(note, index) in value" :key="'note' + index" class="mt-1">
<div v-if="edit">
<div v-for="(note, index) in value" :key="'note' + index" class="mt-1">
<v-card v-if="edit">
<v-card-text>
<v-row align="center">
<v-btn fab x-small color="white" class="mr-2" elevation="0" @click="removeByIndex(value, index)">
<v-icon color="error">{{ $globals.icons.delete }}</v-icon>
<div class="d-flex align-center">
<v-text-field v-model="value[index]['title']" :label="$t('recipe.title')" />
<v-btn icon class="mr-2" elevation="0" @click="removeByIndex(value, index)">
<v-icon>{{ $globals.icons.delete }}</v-icon>
</v-btn>
<v-text-field v-model="value[index]['title']" :label="$t('recipe.title')"></v-text-field>
</v-row>
<v-textarea v-model="value[index]['text']" auto-grow :placeholder="$t('recipe.note')"> </v-textarea>
</div>
<v-textarea v-model="value[index]['text']" auto-grow :placeholder="$t('recipe.note')" />
</v-card-text>
</div>
</v-card>
<div v-else>
<v-card-title class="py-2">
<v-card-title class="text-subtitle-1 font-weight-medium py-1">
{{ note.title }}
</v-card-title>
<v-divider class="mx-2"></v-divider>
<v-card-text>
<VueMarkdown :source="note.text"> </VueMarkdown>
</v-card-text>
</div>
</v-card>
</div>
<div v-if="edit" class="d-flex justify-end">
<BaseButton class="ml-auto my-2" @click="addNote"> {{ $t("general.new") }}</BaseButton>