57 lines
3.3 KiB
HTML
57 lines
3.3 KiB
HTML
<div id="comment-section">
|
|
<div class="card mt-4">
|
|
<div class="card-header text-primary-theme d-flex justify-content-between align-items-center">
|
|
<h5 class="card-title mb-0">{% trans "Comments" %} ({{ comments.count }})</h5>
|
|
{% if 'HX-Request' in request.headers %}
|
|
<button type="button" class="btn btn-light btn-sm" hx-get="{% url 'meeting_details' meeting.slug %}" hx-select="#comment-section" hx-target="#comment-section">
|
|
<i class="bi bi-x-lg"></i> {% trans "Close" %}
|
|
</button>
|
|
{% endif %}
|
|
</div>
|
|
<div class="card-body">
|
|
{% if comments %}
|
|
<div class="row">
|
|
{% for comment in comments %}
|
|
<div class="col-12 mb-3">
|
|
<div class="card">
|
|
<div class="card-header d-flex justify-content-between align-items-start ">
|
|
<div>
|
|
<strong>{{ comment.author.get_full_name|default:comment.author.username }}</strong>
|
|
{% if comment.author != user %}
|
|
<span class="badge bg-secondary ms-2">{% trans "Comment" %}</span>
|
|
{% endif %}
|
|
</div>
|
|
<small class="text-muted">{{ comment.created_at|date:"M d, Y P" }}</small>
|
|
</div>
|
|
<div class="card-body">
|
|
<p class="card-text">{{ comment.content|safe }}</p>
|
|
</div>
|
|
<div class="card-footer">
|
|
{% if comment.author == user or user.is_staff %}
|
|
<div class="btn-group btn-group-sm">
|
|
<button type="button" class="btn btn-outline-primary"
|
|
hx-get="{% url 'edit_meeting_comment' meeting.slug comment.id %}"
|
|
hx-target="#comment-section"
|
|
title="Edit Comment">
|
|
<i class="bi bi-pencil"></i>
|
|
</button>
|
|
<button type="button" class="btn btn-outline-danger"
|
|
hx-get="{% url 'delete_meeting_comment' meeting.slug comment.id %}"
|
|
hx-target="#comment-section"
|
|
title="Delete Comment">
|
|
<i class="bi bi-trash"></i>
|
|
</button>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% else %}
|
|
<p class="text-muted">{% trans "No comments yet. Be the first to comment!" %}</p>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|