Mirrors/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-10-31 02:03:35 -04:00
Code Issues Packages Projects Releases Wiki Activity

improve touch support with icon and handle (#1302)

Browse Source
This commit is contained in:
Hayden
2022-05-27 16:17:25 -08:00
committed by GitHub
parent a96f94a149
commit 07bf5be3ec
1 changed files with 16 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/pages/group/mealplan/planner.vue
View File

@@ -103,7 +103,13 @@
style="min-height: 150px" style="min-height: 150px"
@end="onMoveCallback" @end="onMoveCallback"
> >
<v-card v-for="mealplan in plan.meals" :key="mealplan.id" v-model="hover[mealplan.id]" class="my-1 handle"> <v-card
v-for="mealplan in plan.meals"
:key="mealplan.id"
v-model="hover[mealplan.id]"
class="my-1"
:class="{ handle: $vuetify.breakpoint.smAndUp }"
>
<v-list-item :to="edit || !mealplan.recipe ? null : `/recipe/${mealplan.recipe.slug}`"> <v-list-item :to="edit || !mealplan.recipe ? null : `/recipe/${mealplan.recipe.slug}`">
<v-list-item-avatar :rounded="false"> <v-list-item-avatar :rounded="false">
<RecipeCardImage <RecipeCardImage
@@ -127,7 +133,13 @@
</v-list-item-content> </v-list-item-content>
</v-list-item> </v-list-item>
<v-divider class="mx-2"></v-divider> <v-divider class="mx-2"></v-divider>
<div class="py-2 px-2 d-flex"> <div class="py-2 px-2 d-flex" style="align-items: center">
<v-btn small icon :class="{ handle: !$vuetify.breakpoint.smAndUp }">
<v-icon>
{{ $globals.icons.arrowUpDown }}
</v-icon>
</v-btn>
<v-menu offset-y> <v-menu offset-y>
<template #activator="{ on, attrs }"> <template #activator="{ on, attrs }">
<v-chip v-bind="attrs" label small color="accent" v-on="on" @click.prevent> <v-chip v-bind="attrs" label small color="accent" v-on="on" @click.prevent>
@@ -147,8 +159,8 @@
</v-list-item> </v-list-item>
</v-list> </v-list>
</v-menu> </v-menu>
<v-spacer></v-spacer>
<v-btn small icon @click="actions.deleteOne(mealplan.id)"> <v-btn class="ml-auto" small icon @click="actions.deleteOne(mealplan.id)">
<v-icon>{{ $globals.icons.delete }}</v-icon> <v-icon>{{ $globals.icons.delete }}</v-icon>
</v-btn> </v-btn>
</div> </div>