Comments Complete

  <section class="c-comments u-spacing--double">
    <ul class="c-comment__list u-spacing">
      <div class="c-block__heading u-theme--border-color--darker">
        <h3 class="c-block__heading-title u-theme--color--darker">4 comments</h3>
      </div>
              <li class="c-comment__list-item comment u-spacing">
          <div class="c-comment--inner u-border--left u-theme--border-color--darker">
  <div class="c-comment__avatar u-space--right">
    <img alt="" src="//placeimg.com/32/32/people" class="avatar" height="50" width="50">
  </div>
  <div class="c-comment__body u-spacing--quarter">
    <div class="c-comment__meta">
      <span class="byline u-font--secondary--s can-be--white u-theme--color--darker"><a href="">Bob Smith</a></span>
      <span class="o-divider">|</span>
      <span class="pub_date u-font--secondary--s u-color--gray can-be--white">9 days ago</span><span class="c-comment__edit-link u-font--secondary--s u-theme--color--base"><a class="c-comment-edit-link" href="">(Edit)</a></span>
    </div>
    <p class="c-comment__content">Vivamus sollicitudin ipsum vel rutrum facilisis. Vestibulum eu cursus massa. Donec faucibus velit eu enim dapibus, sed scelerisque nibh finibus. Praesent imperdiet, leo ut ullamcorper facilisis, felis neque vestibulum mi, in vehicula turpis libero vestibulum eros. Nunc ac lectus id dui eleifend dignissim.</p>
    <div class="c-comment__reply">
      <a href="" class="u-font--secondary--s u-theme--color--base">Reply</a>
    </div>
  </div>
</div>
                      <ul class="c-comment__children__list children u-spacing">
              <li class="c-comment__children__list-item comment">
                <div class="c-comment--inner u-border--left u-theme--border-color--darker">
  <div class="c-comment__avatar u-space--right">
    <img alt="" src="//placeimg.com/32/32/people" class="avatar" height="50" width="50">
  </div>
  <div class="c-comment__body u-spacing--quarter">
    <div class="c-comment__meta">
      <span class="byline u-font--secondary--s can-be--white u-theme--color--darker"><a href="">Bob Smith</a></span>
      <span class="o-divider">|</span>
      <span class="pub_date u-font--secondary--s u-color--gray can-be--white">9 days ago</span><span class="c-comment__edit-link u-font--secondary--s u-theme--color--base"><a class="c-comment-edit-link" href="">(Edit)</a></span>
    </div>
    <p class="c-comment__content">Vivamus sollicitudin ipsum vel rutrum facilisis. Vestibulum eu cursus massa. Donec faucibus velit eu enim dapibus, sed scelerisque nibh finibus. Praesent imperdiet, leo ut ullamcorper facilisis, felis neque vestibulum mi, in vehicula turpis libero vestibulum eros. Nunc ac lectus id dui eleifend dignissim.</p>
    <div class="c-comment__reply">
      <a href="" class="u-font--secondary--s u-theme--color--base">Reply</a>
    </div>
  </div>
</div>
              </li>
            </ul>
                      <ul class="c-comment__children__list children u-spacing">
              <li class="c-comment__children__list-item comment">
                <div class="c-comment--inner u-border--left u-theme--border-color--darker">
  <div class="c-comment__avatar u-space--right">
    <img alt="" src="//placeimg.com/32/32/people" class="avatar" height="50" width="50">
  </div>
  <div class="c-comment__body u-spacing--quarter">
    <div class="c-comment__meta">
      <span class="byline u-font--secondary--s can-be--white u-theme--color--darker"><a href="">Bob Smith</a></span>
      <span class="o-divider">|</span>
      <span class="pub_date u-font--secondary--s u-color--gray can-be--white">9 days ago</span><span class="c-comment__edit-link u-font--secondary--s u-theme--color--base"><a class="c-comment-edit-link" href="">(Edit)</a></span>
    </div>
    <p class="c-comment__content">Vivamus sollicitudin ipsum vel rutrum facilisis. Vestibulum eu cursus massa. Donec faucibus velit eu enim dapibus, sed scelerisque nibh finibus. Praesent imperdiet, leo ut ullamcorper facilisis, felis neque vestibulum mi, in vehicula turpis libero vestibulum eros. Nunc ac lectus id dui eleifend dignissim.</p>
    <div class="c-comment__reply">
      <a href="" class="u-font--secondary--s u-theme--color--base">Reply</a>
    </div>
  </div>
</div>
              </li>
            </ul>
                  </li>
              <li class="c-comment__list-item comment u-spacing">
          <div class="c-comment--inner u-border--left u-theme--border-color--darker">
  <div class="c-comment__avatar u-space--right">
    <img alt="" src="//placeimg.com/32/32/people" class="avatar" height="50" width="50">
  </div>
  <div class="c-comment__body u-spacing--quarter">
    <div class="c-comment__meta">
      <span class="byline u-font--secondary--s can-be--white u-theme--color--darker"><a href="">Bob Smith</a></span>
      <span class="o-divider">|</span>
      <span class="pub_date u-font--secondary--s u-color--gray can-be--white">9 days ago</span><span class="c-comment__edit-link u-font--secondary--s u-theme--color--base"><a class="c-comment-edit-link" href="">(Edit)</a></span>
    </div>
    <p class="c-comment__content">Vivamus sollicitudin ipsum vel rutrum facilisis. Vestibulum eu cursus massa. Donec faucibus velit eu enim dapibus, sed scelerisque nibh finibus. Praesent imperdiet, leo ut ullamcorper facilisis, felis neque vestibulum mi, in vehicula turpis libero vestibulum eros. Nunc ac lectus id dui eleifend dignissim.</p>
    <div class="c-comment__reply">
      <a href="" class="u-font--secondary--s u-theme--color--base">Reply</a>
    </div>
  </div>
</div>
                  </li>
          </ul>
    <div class="c-comment-form">
  <div class="comment-respond u-spacing--half">
    <h3 class="comment-reply-title u-font--secondary--m u-text-transform--upper u-theme--color--darker"><strong>Leave a Comment</strong> <small><a rel="nofollow" id="cancel-comment-reply-link" href="/spirituality/sabbath/article/the-sabbath-in-colossians/#respond" style="display:none;">Cancel reply</a></small></h3>
    <form action="" method="post" class="u-spacing--half" novalidate="">
      <p class="comment-form-comment">
        <textarea name="comment" cols="45" rows="8" aria-required="true" required="required"></textarea>
      </p>
      <p class="form-submit">
        <input name="submit" type="submit" class="submit" value="Post Comment">
      </p>
    </form>
  </div>
</div>
  </section>

{% if comments %}
  <section class="c-comments u-spacing--double">
    <ul class="c-comment__list u-spacing">
      <div class="c-block__heading u-theme--border-color--darker">
        <h3 class="c-block__heading-title u-theme--color--darker">4 comments</h3>
      </div>
      {% for comment in comments.comment %}
        <li class="c-comment__list-item comment u-spacing">
          {% include '@molecules/components/comment.twig' with {
            'single_comment_text' : comment.comment_text,
            'single_comment_date' : comment.comment_date,
            'single_comment_byline' : comment.comment_byline
          } %}
          {% for comment_child in comment.comment_children %}
            <ul class="c-comment__children__list children u-spacing">
              <li class="c-comment__children__list-item comment">
                {% include '@molecules/components/comment.twig' with {
                  'single_comment_text' : comment_child.comment_text,
                  'single_comment_date' : comment_child.comment_date,
                  'single_comment_byline' : comment_child.comment_byline
                } %}
              </li>
            </ul>
          {% endfor %}
        </li>
      {% endfor %}
    </ul>
    {% include '@molecules/forms/comment-form.twig' %}
  </section>
{% endif %}