From f23110919491d8de5beed091dfd5d575b1fb2430 Mon Sep 17 00:00:00 2001
From: Michael Genson <71845777+michael-genson@users.noreply.github.com>
Date: Sat, 20 Aug 2022 02:01:55 -0500
Subject: [PATCH] fix: print view for recipes with multiple ingredient sections
 (#1580)

* fix for recipes with multiple ingredient sections

* removed unused key
---
 frontend/components/Domain/Recipe/RecipePrintView.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/components/Domain/Recipe/RecipePrintView.vue b/frontend/components/Domain/Recipe/RecipePrintView.vue
index 35e4cbb60b96..668dc480c21e 100644
--- a/frontend/components/Domain/Recipe/RecipePrintView.vue
+++ b/frontend/components/Domain/Recipe/RecipePrintView.vue
@@ -22,11 +22,11 @@
         :key="`ingredient-section-${sectionIndex}`"
         class="print-section"
       >
-        <div class="ingredient-grid" :style="{gridTemplateRows:`repeat(${Math.ceil(ingredientSection.ingredients.length / 2)}, 1fr)`}">
+        <h4 v-if="ingredientSection.ingredients[0].title" class="ingredient-title mt-2">
+            {{ ingredientSection.ingredients[0].title }}
+        </h4>
+        <div class="ingredient-grid" :style="{gridTemplateRows:`repeat(${Math.ceil(ingredientSection.ingredients.length / 2)}, min-content)`}">
           <template v-for="(ingredient, ingredientIndex) in ingredientSection.ingredients">
-            <h4 v-if="ingredient.title" :key="`ingredient-title-${ingredientIndex}`" class="ingredient-title mt-2">
-              {{ ingredient.title }}
-            </h4>
             <p :key="`ingredient-${ingredientIndex}`" class="ingredient-body" v-html="parseText(ingredient)" />
           </template>
         </div>