github/mealie
1
0
Fork 0
mirror of https://github.com/hay-kot/mealie.git synced 2025-07-16 10:03:54 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

fix: update recipe time row direction on small screens (#5107)

Browse source
This commit is contained in:
Kuchenpirat 2025-02-27 14:48:29 +01:00 • committed by GitHub
parent 4843a9a74a
commit 3d1b76bcad
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 9 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

10
frontend/components/Domain/Recipe/RecipeTimeCard.vue
View file

@ -12,15 +12,19 @@
<v-divider v-if="validateTotalTime && (validatePrepTime || validatePerformTime)" class="my-2" />
<!-- Prep Time & Perform Time -->
<div v-if="validatePrepTime || validatePerformTime" class="time-card-flex mx-auto">
<v-row no-gutters class="d-flex justify-center align-center" style="width: 100%;" :style="fontSize">
<div v-if="validatePrepTime" class="d-flex flex-no-wrap">
<v-row
no-gutters
class="d-flex justify-center align-center" :class="{'flex-column': $vuetify.breakpoint.smAndDown}"
style="width: 100%;" :style="fontSize"
>
<div v-if="validatePrepTime" class="d-flex flex-no-wrap my-1">
<v-icon :large="!small" :dense="small" left color="primary">
{{ $globals.icons.knfife }}
</v-icon>
<p class="my-0"><span class="font-weight-bold">{{ validatePrepTime.name }}</span><br>{{ validatePrepTime.value }}</p>
</div>
<v-divider v-if="validatePrepTime && validatePerformTime" vertical class="mx-4" />
<div v-if="validatePerformTime" class="d-flex flex-no-wrap">
<div v-if="validatePerformTime" class="d-flex flex-no-wrap my-1">
<v-icon :large="!small" :dense="small" left color="primary">
{{ $globals.icons.potSteam }}
</v-icon>