{%- capture article_class %}media js-comment comment{% if include.name == site.author.name %} admin{% endif %}{% if include.is_reply %} child{% endif %}{% endcapture %} {% assign comment_id = include.uid | prepend: 'comment-' %}

<article class=“{{ article_class }}” id=“{{ comment_id }}” uid=“{{ include.uid }}”>

<!-- Gravatar here -->
<figure class="media-left">
    <p class="image is-64x64">
        {% if include.avatar %}
        <img src="{{ include.avatar }}" 
            alt="{{ include.name | escape }}" 
            width="64px" 
            height="64px" 
            class="is-rounded">
        {% elsif include.email != "" %}
        <img src="https://www.gravatar.com/avatar/{{ include.email }}?d={{ '/assets/img/user-circle-solid.svg' | absolute_url | url_encode }}&&s=64"
            srcset="https://www.gravatar.com/avatar/{{ include.email }}?d={{ '/assets/img/user-circle-solid.svg' | absolute_url | url_encode }}&&s=128 2x" 
            alt="{{ include.name | escape }}"
            width="64px"
            height="64px"
            class="is-rounded">
        {% else %}
        <img src="{{ '/assets/img/user-circle-solid.svg' | absolute_url }}" 
            alt="{{ include.name | escape }}" 
            width="64px"
            height="64px"
            class="is-rounded">
        {% endif %}
    </p>
</figure>
<!-- end gravatar -->
<div class="media-content">
    <div class="comment__author">
        <p>
            <strong>{{- include.name | strip_html -}}</strong> <small class="comment__date">
                {%- if include.date -%}
                <a href="#{{ comment_id}}" title="Permalink to this comment">
                    {{- include.date | date:"%B %eth, %Y %H:%M" -}}
                </a>
                {%- endif -%}
            </small>
            <br>
            {{ include.message | strip_html | markdownify }}
        </p>
    </div>

{% unless include.is_reply %}

<nav class="level is-mobile">
    <div class="level-left">
        <a rel="nofollow" 
            class="level-item comment__reply-link"
            data-comment-id="{{ comment_id }}"
            data-page-slug="{{ page.slug }}"
            data-uid="{{ include.uid }}" 
            data-respond-id="respond">
            <span class="icon is-small pr-3">
                <i class="fas fa-reply"></i></span> <small>reply to {{ include.name }}</small>
        </a> 
    </div>
</nav>

{%- capture this_uid %}{{ include.uid }}{% endcapture %} {%- assign replies = site.data.comments | where_exp: 'item', 'item.replying_to_uid == this_uid' %} {%- assign replies_date = replies | sort: 'date' %} {% for reply in replies_date %} {%- assign email = reply.email -%} {%- assign name = reply.name -%} {%- assign url = reply.url -%} {%- assign date = reply.date -%} {%- assign message = reply.message -%} {%- assign uid = reply._id -%} {% include themes/jmblog-theme/components/comment.html is_reply=true uid=uid email=email name=name url=url date=date message=message %} {% endfor %}

<!– <hr style=“border-top: 1px solid ccc; background: transparent; margin-bottom: 10px;”> –> {% endunless %}

</div>

</article>