{% extends 'main.html' %}
<!-- context = {'speciesComments': speciesComments } -->
{% block content %}
<div class="container">
    <h3>Species Comments ({{speciesComments|length}})</h3>
     {% if speciesComments|length > 0  %}
        {% for speciesComment in speciesComments %}
        <div class="div-line-below">
            <p>
                <a href="{% url 'aquarist' speciesComment.user.id %}">{{speciesComment.user.get_display_name}}</a>&nbsp;&nbsp;
                <a href="{% url 'species' speciesComment.species.id %}">{{speciesComment.species.name}}</a>&nbsp;&nbsp;
                <i>"{{speciesComment.comment}}"</i>&nbsp;&nbsp;
            </p>
            <!--p><a class="btn btn-secondary" href="{% url 'deleteSpeciesComment' speciesComment.id  %}" role="button">Delete Comment</a></p-->
        </div>
        {% endfor %}
    {% else %}
    <h5>None</h5>
    {% endif %}     
</div>

{% endblock content %}