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

ui: changed ingredient auto grid to be more natural (#1578)

Browse Source
This commit is contained in:
Michael Genson
2022-08-19 14:42:06 -05:00
committed by GitHub
parent b092654b43
commit f4278737fb
1 changed files with 2 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
frontend/components/Domain/Recipe/RecipePrintView.vue
View File

@@ -22,7 +22,7 @@
:key="`ingredient-section-${sectionIndex}`" :key="`ingredient-section-${sectionIndex}`"
class="print-section" class="print-section"
> >
<div class="ingredient-grid"> <div class="ingredient-grid" :style="{gridTemplateRows:`repeat(${Math.ceil(ingredientSection.ingredients.length / 2)}, 1fr)`}">
<template v-for="(ingredient, ingredientIndex) in ingredientSection.ingredients"> <template v-for="(ingredient, ingredientIndex) in ingredientSection.ingredients">
<h4 v-if="ingredient.title" :key="`ingredient-title-${ingredientIndex}`" class="ingredient-title mt-2"> <h4 v-if="ingredient.title" :key="`ingredient-title-${ingredientIndex}`" class="ingredient-title mt-2">
{{ ingredient.title }} {{ ingredient.title }}
@@ -245,6 +245,7 @@ p {
.ingredient-grid { .ingredient-grid {
display: grid; display: grid;
grid-auto-flow: column;
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
grid-gap: 0.5rem; grid-gap: 0.5rem;
} }