<!DOCTYPE html>
<html lang="en">
{% include "shared/_head.html.j2" %}

  <body id="{{slug}}">
{% include "shared/_navbar.html.j2" %}

    <div class="container">
      <div class="row">
        <h1>{{headline}}</h1>
        {% for item in body %}
          {% if item.text %}
            {{ item.text | replace('$JQ_VERSION', jq_version) | markdownify }}
          {% endif %}

          {% if item.command %}
            {% set resultID = unique_id() %}
            <div class="tutorial-example">
              <div class="accordion-heading">
                <pre>{{item.command}}</pre>
                <a data-toggle="collapse" href="#result{{resultID}}">Show result</a>
              </div>
              <div id="result{{resultID}}" class="accordion-body collapse">
                <pre>{{item.result}}</pre>
              </div>
            </div>
          {% endif %}
        {% endfor %}
      </div>
    </div>

{% include "shared/_footer.html.j2" %}
  </body>
</html>
