Highlight targeted comment & add permalink
This commit is contained in:
parent
1fa73b90fb
commit
23985a3263
3 changed files with 41 additions and 31 deletions
|
@ -229,6 +229,14 @@ textarea, input {
|
||||||
color: var(--main3);
|
color: var(--main3);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.comment:target {
|
||||||
|
background-color: var(--warning-background);
|
||||||
|
}
|
||||||
|
|
||||||
|
.permalink {
|
||||||
|
font-size: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
/* MESSAGES */
|
/* MESSAGES */
|
||||||
.messages p {
|
.messages p {
|
||||||
background-color: var(--background2);
|
background-color: var(--background2);
|
||||||
|
|
|
@ -11,35 +11,5 @@
|
||||||
{{ article.get_formatted_content|safe }}
|
{{ article.get_formatted_content|safe }}
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
<section class="comments">
|
{% include 'articles/comment_snippet.html' %}
|
||||||
<h2>Comments</h2>
|
|
||||||
{% for comment in comments %}
|
|
||||||
<article id="{{ comment.id }}" class="comment">
|
|
||||||
<p class="metadata">
|
|
||||||
<span class="username">{{ comment.username }}</span> |
|
|
||||||
<time datetime="{{ comment.created_at|date:'c' }}">
|
|
||||||
{{ comment.created_at|date:"DATETIME_FORMAT" }}
|
|
||||||
</time>
|
|
||||||
{% include "articles/admin_link_snippet.html" with article=comment %}
|
|
||||||
</p>
|
|
||||||
<p class="content">
|
|
||||||
{{ comment.content|linebreaksbr }}
|
|
||||||
</p>
|
|
||||||
</article>
|
|
||||||
{% empty %}
|
|
||||||
No reaction yet, write your own!
|
|
||||||
{% endfor %}
|
|
||||||
<form id="comment-form" action="{% url 'create-comment' slug=article.slug %}" method="post">
|
|
||||||
{% csrf_token %}
|
|
||||||
<table>
|
|
||||||
{{ form.as_table }}
|
|
||||||
</table>
|
|
||||||
<button type="submit">Submit</button>
|
|
||||||
<p class="helptext">
|
|
||||||
Your comment may not be approved if it's not respectful, on topic or spammy.
|
|
||||||
If you feel I've made a mistake with your comment, please
|
|
||||||
<a href="/about-me/">send me a message</a>!
|
|
||||||
</p>
|
|
||||||
</form>
|
|
||||||
</section>
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
32
articles/templates/articles/comment_snippet.html
Normal file
32
articles/templates/articles/comment_snippet.html
Normal file
|
@ -0,0 +1,32 @@
|
||||||
|
<section class="comments">
|
||||||
|
<h2>Comments</h2>
|
||||||
|
{% for comment in comments %}
|
||||||
|
<article id="{{ comment.id }}" class="comment">
|
||||||
|
<p class="metadata">
|
||||||
|
<a class="permalink" title="Permalink" href="#{{ comment.id }}">🔗</a>
|
||||||
|
<span class="username">{{ comment.username }}</span> |
|
||||||
|
<time datetime="{{ comment.created_at|date:'c' }}">
|
||||||
|
{{ comment.created_at|date:"DATETIME_FORMAT" }}
|
||||||
|
</time>
|
||||||
|
{% include "articles/admin_link_snippet.html" with article=comment %}
|
||||||
|
</p>
|
||||||
|
<p class="content">
|
||||||
|
{{ comment.content|linebreaksbr }}
|
||||||
|
</p>
|
||||||
|
</article>
|
||||||
|
{% empty %}
|
||||||
|
No reaction yet, write your own!
|
||||||
|
{% endfor %}
|
||||||
|
<form id="comment-form" action="{% url 'create-comment' slug=article.slug %}" method="post">
|
||||||
|
{% csrf_token %}
|
||||||
|
<table>
|
||||||
|
{{ form.as_table }}
|
||||||
|
</table>
|
||||||
|
<button type="submit">Submit</button>
|
||||||
|
<p class="helptext">
|
||||||
|
Your comment may not be approved if it's not respectful, on topic or spammy.
|
||||||
|
If you feel I've made a mistake with your comment, please
|
||||||
|
<a href="/about-me/">send me a message</a>!
|
||||||
|
</p>
|
||||||
|
</form>
|
||||||
|
</section>
|
Reference in a new issue