Update recipe.html

Test to see if I can bring in this pull request from upstream 

clarklab#20

_layouts/recipe.html

@@ -54,18 +54,35 @@ <h4 class="blue mt0 mb2 xs-center">{{ site.translation[site.language].ingredient
  <ul itemprop="ingredients">
  <!-- list ingredients that make up recipe -->
  {% for ingredient in page.ingredients %}
- <li itemprop="recipeIngredient">{{ ingredient | markdownify }}<input type="checkbox"></li>
+ {% if ingredient.first %}
+ <h4>{{ ingredient.first[0] }}</h4>
+ <ul itemprop="recipeIngredientGroup">
+ {% for i in ingredient.first[1] %}
+ <li itemprop="recipeIngredient">{{ i | markdownify }}<input type="checkbox"></li>
+ {% endfor %}
+ </ul>
+ {% else %}
+ <li itemprop="recipeIngredient">{{ ingredient | markdownify }}<input type="checkbox"></li>
+ {% endif %}
  {% endfor %}
  </ul>
  {% endif %}
-
  </div>
 
  <div class="sm-col sm-col-6 lg-col-6">
  <h4 class="blue mt0 mb2 xs-center">{{ site.translation[site.language].directions }}</h4>
  <ul itemprop="recipeInstructions">
  {% for direction in page.directions %}
- <li>{{ direction | markdownify }}<input type="checkbox"></li>
+ {% if direction.first %}
+ <h4>{{ direction.first[0] }}</h4>
+ <ul itemprop="instructionGroup">
+ {% for d in direction.first[1] %}
+ <li itemprop="instruction">{{ d | markdownify }}<input type="checkbox"></li>
+ {% endfor %}
+ </ul>
+ {% else %}
+ <li itemprop="instruction">{{ direction | markdownify }}<input type="checkbox"></li>
+ {% endif %}
  {% endfor %}
  </ul>
  </div>
@@ -102,15 +119,33 @@ <h4 class="blue center">{{recipe.title}}</h4>
 
  <h4 class="blue regular xs-center">{{ site.translation[site.language].ingredients }}</h4>
  <ul class="ingredients" itemprop="ingredients">
- {% for item in recipe.ingredients %}
- <li itemprop="ingredient">{{ item | markdownify }}<input type="checkbox"></li>
- {% endfor %}
+ {% for ingredient in recipe.ingredients %}
+ {% if ingredient.first %}
+ <h4>{{ ingredient.first[0] }}</h4>
+ <ul itemprop="recipeIngredientGroup">
+ {% for i in ingredient.first[1] %}
+ <li itemprop="recipeIngredient">{{ i | markdownify }}<input type="checkbox"></li>
+ {% endfor %}
+ </ul>
+ {% else %}
+ <li itemprop="recipeIngredient">{{ ingredient | markdownify }}<input type="checkbox"></li>
+ {% endif %}
+ {% endfor %}
  </ul>
 
  <h4 class="blue regular xs-center">{{ site.translation[site.language].directions }}</h4>
  <ul itemprop="instructions">
- {% for item in recipe.directions %}
- <li>{{ item | markdownify }}<input type="checkbox"></li>
+ {% for direction in recipe.directions %}
+ {% if direction.first %}
+ <h4>{{ direction.first[0] }}</h4>
+ <ul itemprop="instructionGroup">
+ {% for d in direction.first[1] %}
+ <li itemprop="instruction">{{ d | markdownify }}<input type="checkbox"></li>
+ {% endfor %}
+ </ul>
+ {% else %}
+ <li itemprop="instruction">{{ direction | markdownify }}<input type="checkbox"></li>
+ {% endif %}
  {% endfor %}
  </ul>
 
@@ -129,4 +164,4 @@ <h4 class="blue regular xs-center">{{ site.translation[site.language].directions
 
  </article>
 
-</div>
+</div>