michael/pyfedi
1
0
Fork 0
mirror of https://codeberg.org/rimu/pyfedi synced 2025-01-23 19:36:56 -08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request 'post_reply teasers' (#262) from h3ndrik/pyfedi:comment_teaser2 into main

Browse source 
Reviewed-on: https://codeberg.org/rimu/pyfedi/pulls/262
This commit is contained in:
rimu 2024-07-12 02:51:22 +00:00
commit 5575a660ca
12 changed files with 154 additions and 68 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.gitignore vendored
View file

@ -159,7 +159,6 @@ cython_debug/
# and can be added to the global gitignore or merged into this file. For a more nuclear
# option (not recommended) you can uncomment the following to ignore the entire idea folder.
.idea/
app/static/*.css.map
/app/static/media/
celery_worker.py

38
app/static/styles.css
View file

@ -765,19 +765,15 @@ div.navbar {
bottom: -12px;
left: 10px;
}
.post_list .post_teaser .main_row .post_utilities a {
.post_list .post_teaser .main_row .post_utilities a, .post_list .post_teaser .main_row .post_utilities > div, .post_list .post_teaser .main_row .post_utilities > span {
display: inline-block;
min-width: 44px;
line-height: 44px;
text-align: center;
}
.post_list .post_teaser .main_row .post_utilities a:first-child {
.post_list .post_teaser .main_row .post_utilities a:first-child, .post_list .post_teaser .main_row .post_utilities > div:first-child, .post_list .post_teaser .main_row .post_utilities > span:first-child {
text-align: left;
}
.post_list .post_teaser .main_row .post_options {
position: absolute;
bottom: -1px;
}
.post_list .post_teaser .utilities_row a {
display: inline-block;
min-width: 44px;
@ -785,9 +781,6 @@ div.navbar {
justify-content: center;
align-content: center;
}
.post_list .post_teaser .utilities_row .preview_image, .post_list .post_teaser .utilities_row .post_options {
text-align: center;
}
.post_list .post_teaser .thumbnail {
float: right;
padding-left: 0;
@ -1070,9 +1063,7 @@ div.navbar {
}
.voting_buttons_new .upvote_button, .voting_buttons_new .downvote_button {
display: inline-block;
padding: 5px 0 5px 3px;
text-align: center;
position: relative;
cursor: pointer;
color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
min-width: 44px;
@ -1095,16 +1086,10 @@ div.navbar {
color: darkred;
font-weight: bold;
}
.voting_buttons_new .upvote_button {
top: 1px;
}
.voting_buttons_new .upvote_button .htmx-indicator {
left: 13px;
top: 7px;
}
.voting_buttons_new .downvote_button {
top: 1px;
}
.voting_buttons_new .downvote_button .htmx-indicator {
left: 12px;
top: 5px;
@ -1238,12 +1223,16 @@ div.navbar {
border-radius: 50%;
vertical-align: middle;
}
.comment .comment_author a.unhide {
.comment .comment_community {
display: inline-block;
}
.comment .comment_community img {
height: 1rem;
width: auto;
}
.comment a.unhide {
display: none;
text-decoration: none;
padding: 5px 15px;
position: relative;
top: 3px;
}
.comment .comment_actions {
margin-top: -10px;
@ -1259,7 +1248,10 @@ div.navbar {
.comment .comment_actions .hide_button a {
padding: 5px 15px;
}
.comment .comment_actions .notif_toggle {
.comment .comment_actions .notify_toggle {
display: inline-block;
}
.comment .comment_actions .notify_toggle a {
text-decoration: none;
font-size: 87%;
padding: 5px 15px;
@ -1711,7 +1703,7 @@ form h5 {
text-decoration: none;
}
.notif_toggle {
.notify_toggle {
display: block;
position: absolute;
top: 2px;

45
app/static/styles.scss
View file

@ -356,7 +356,7 @@ div.navbar {
position: absolute;
bottom: -12px;
left: 10px;
a {
a, > div, > span {
display: inline-block;
min-width: 44px;
line-height: 44px;
@ -367,11 +367,6 @@ div.navbar {
}
}
}
.post_options {
position: absolute;
bottom: -1px;
}
}
.utilities_row {
@ -382,9 +377,6 @@ div.navbar {
justify-content: center;
align-content: center;
}
.preview_image, .post_options {
text-align: center;
}
}
.thumbnail {
@ -710,9 +702,7 @@ div.navbar {
.upvote_button, .downvote_button {
display: inline-block;
padding: 5px 0 5px 3px;
text-align: center;
position: relative;
cursor: pointer;
color: rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,1));
min-width: $min-touch-target;
@ -741,8 +731,6 @@ div.navbar {
}
.upvote_button {
top: 1px;
.htmx-indicator {
left: 13px;
top: 7px;
@ -750,7 +738,6 @@ div.navbar {
}
.downvote_button {
top: 1px;
.htmx-indicator {
left: 12px;
top: 5px;
@ -900,16 +887,21 @@ div.navbar {
border-radius: 50%;
vertical-align: middle;
}
}
a.unhide {
display: none;
text-decoration: none;
padding: 5px 15px;
position: relative;
top: 3px;
.comment_community {
display: inline-block;
img {
height: 1rem;
width: auto;
}
}
a.unhide {
display: none;
text-decoration: none;
}
.comment_actions {
margin-top: -10px;
position: relative;
@ -926,10 +918,13 @@ div.navbar {
}
}
.notif_toggle {
text-decoration: none;
font-size: 87%;
padding: 5px 15px;
.notify_toggle {
display: inline-block;
a {
text-decoration: none;
font-size: 87%;
padding: 5px 15px;
}
}
}
@ -1416,7 +1411,7 @@ form {
text-decoration: none;
}
.notif_toggle {
.notify_toggle {
display: block;
position: absolute;
top: 2px;

7
app/templates/admin/deleted_posts.html
View file

@ -21,7 +21,10 @@
<h2 class="mt-4" id="comments">Deleted comments</h2>
<div class="post_list">
{% for post_reply in post_replies.items %}
{% include 'post/_post_reply_teaser.html' %}
{% with teaser=True, disable_voting=True, no_collapse=True %}
{% include 'post/_post_reply_teaser.html' %}
{% endwith %}
<hr />
{% else %}
<p>{{ _('No deleted comments.') }}</p>
{% endfor %}
@ -38,4 +41,4 @@
</div>
</div>
<hr />
{% endblock %}
{% endblock %}

7
app/templates/admin/spam_posts.html
View file

@ -19,7 +19,10 @@
<h2 class="mt-4" id="comments">Downvoted comments</h2>
<div class="post_list">
{% for post_reply in post_replies.items %}
{% include 'post/_post_reply_teaser.html' %}
{% with teaser=True, disable_voting=True, no_collapse=True %}
{% include 'post/_post_reply_teaser.html' %}
{% endwith %}
<hr />
{% endfor %}
</div>
{% else %}
@ -34,4 +37,4 @@
</div>
</div>
<hr />
{% endblock %}
{% endblock %}

92
app/templates/post/_post_reply_teaser.html
View file

@ -1,5 +1,89 @@
<div class="post_reply_teaser">
{{ post_reply.body_html|safe }}
<p><a href="{{ url_for('activitypub.post_ap', post_id=post_reply.post.id, _anchor='comment_' + str(post_reply.id)) }}">{{ _('View context') }}</a></p>
{# Options:
teaser: Renders just a teaser
disable_voting: Disable voting buttons (to prevent mass downvoting)
no_collapse: Don't collapse for admin and moderator views
#}
{% if current_user.is_authenticated -%}
{% set collapsed = (post_reply.score <= current_user.reply_collapse_threshold)
and not no_collapse -%}
{% else -%}
{% set collapsed = (post_reply.score <= -10) and not no_collapse -%}
{% endif -%}
<div class="container comment{% if post_reply.score <= -10 %} low_score{% endif %}" id="comment_{{ post_reply.id }}">
{% if not post_reply.author.indexable -%}<!--googleoff: all-->{% endif -%}
{% if teaser -%}
<div class="row">
<div class="col-12 hidable">
reply to: <a href="{{ url_for('activitypub.post_ap', post_id=post_reply.post.id, _anchor='comment_' + str(post_reply.id)) }}">{{ post_reply.post.title | truncate(80, True) }}</a>
<span class="comment_community">in {{ render_communityname(post_reply.post.community) }}</span>
</div>
</div>
{% endif -%}
<div class="row">
<div class="col-auto comment_author">
by
{{ render_username(post_reply.author) }}
{% if post_reply.author.id == post_reply.post.author.id -%}
<span title="Submitter of original post" aria-label="{{ _('Post creator') }}" class="small"> [OP]</span>
{% endif -%}
</div>
<div class="col-auto text-muted small">
{{ moment(post_reply.posted_at).fromNow(refresh=True) }}
{% if post_reply.edited_at -%}, edited {{ moment(post_reply.edited_at).fromNow(refresh=True) }} {% endif -%}
</div>
<div class="col-auto">
{% if post_reply.reports and current_user.is_authenticated and post_reply.post.community.is_moderator(current_user) -%}
<span class="red fe fe-report" title="{{ _('Reported. Check comment for issues.') }}"></span>
{% endif -%}
</div>
<div class="col-auto">
<a class="unhide" href="#"><span class="fe fe-expand"></span></a>
</div>
</div>
<div class="row comment_body hidable{% if post_reply.reports and current_user.is_authenticated and post_reply.post.community.is_moderator(current_user) %} reported{% endif %}">
<div class="col-12">
{{ post_reply.body_html | community_links | safe }}
</div>
</div>
<div class="row comment_actions hidable">
<div class="col-auto">
{% if post_reply.post.comments_enabled -%}
<a href="{{ url_for('post.add_reply', post_id=post_reply.post.id, comment_id=post_reply.id) }}" class="" rel="nofollow noindex"><span class="fe fe-reply"></span> reply</a>
{% endif -%}
</div>
<div class="col-auto voting_buttons_new">
{% if not disable_voting -%}
{% with comment=post_reply, community=post_reply.post.community -%}
{% include "post/_comment_voting_buttons.html" -%}
{% endwith -%}
{% endif -%}
</div>
<div class="col-auto hide_button">
{% if collapsed -%}
<a href='#' class=""><span class="fe fe-expand"></span></a>
{% else -%}
<a href='#' class=""><span class="fe fe-collapse"></span></a>
{% endif -%}
</div>
<div class="col-auto ms-auto">
{% if current_user.is_authenticated -%}
{% with comment=dict(comment=post_reply) -%}
{% include "post/_reply_notification_toggle.html" -%}
{% endwith -%}
{% endif -%}
</div>
<div class="col-auto">
<a href="{{ url_for('post.post_reply_options', post_id=post_reply.post.id, comment_id=post_reply.id) }}" class="" rel="nofollow noindex" aria-label="{{ _('Comment options') }}"><span class="fe fe-options" title="Options"> </span></a>
</div>
</div>
{% if not post_reply.author.indexable -%}<!--googleon all-->{% endif -%}
{% if collapsed -%}
<script nonce="{{ session['nonce'] }}" type="text/javascript">
if (typeof(toBeHidden) === 'undefined') {
toBeHidden = Array();
}
toBeHidden.push({{ post_reply.id }});
</script>
{% endif -%}
</div>
<hr />

2
app/templates/post/_post_teaser.html
View file

@ -84,7 +84,7 @@
<a href="{{ post.url }}" rel="nofollow ugc" class="preview_image" target="_blank" aria-label="{{ _('View image') }}" aria-hidden="true"><span class="fe fe-magnify"></span></a>
{% endif -%}
{% endif -%}
<a href="{{ url_for('post.post_options', post_id=post.id) }}" rel="nofollow" class="post_options" aria-label="{{ _('Options') }}"><span class="fe fe-options" title="Options"> </span></a>
<a href="{{ url_for('post.post_options', post_id=post.id) }}" rel="nofollow" aria-label="{{ _('Options') }}"><span class="fe fe-options" title="Options"> </span></a>
</div>
</div>
</div>

4
app/templates/post/_reply_notification_toggle.html
View file

@ -1,4 +1,4 @@
<a href="{{ url_for('post.post_reply_notification', post_reply_id=comment['comment'].id) }}" rel="nofollow"
class="notif_toggle fe {{ 'fe-bell' if comment['comment'].notify_new_replies(current_user.id) else 'fe-no-bell' }}"
class="fe {{ 'fe-bell' if comment['comment'].notify_new_replies(current_user.id) else 'fe-no-bell' }}"
hx-post="{{ url_for('post.post_reply_notification', post_reply_id=comment['comment'].id) }}" hx-trigger="click throttle:1s" hx-swap="outerHTML"
title="{{ _('Notify about replies') }}" aria-label="{{ _('Notify about replies') }}"></a>
title="{{ _('Notify about replies') }}" aria-label="{{ _('Notify about replies') }}"></a>

8
app/templates/post/continue_discussion.html
View file

@ -46,9 +46,11 @@
<a href='#'><span class="fe fe-collapse"></span></a>
{% endif %}
</div>
{% if current_user.is_authenticated and current_user.verified and current_user.id == comment['comment'].author.id %}
{% include "post/_reply_notification_toggle.html" %}
{% endif %}
<div class="notify_toggle">
{% if current_user.is_authenticated and current_user.verified and current_user.id == comment['comment'].author.id %}
{% include "post/_reply_notification_toggle.html" %}
{% endif %}
</div>
<a href="{{ url_for('post.post_reply_options', post_id=post.id, comment_id=comment['comment'].id) }}" class="comment_actions_link" rel="nofollow"><span class="fe fe-options" title="Options"> </span></a>
</div>
{% if comment['replies'] %}

8
app/templates/post/post.html
View file

@ -107,9 +107,11 @@
<a href='#'><span class="fe fe-collapse"></span></a>
{% endif -%}
</div>
{% if current_user.is_authenticated and current_user.verified -%}
{% include "post/_reply_notification_toggle.html" -%}
{% endif -%}
<div class="notify_toggle">
{% if current_user.is_authenticated and current_user.verified -%}
{% include "post/_reply_notification_toggle.html" -%}
{% endif -%}
</div>
<a href="{{ url_for('post.post_reply_options', post_id=post.id, comment_id=comment['comment'].id) }}" class="comment_actions_link" rel="nofollow noindex" aria-label="{{ _('Comment options') }}"><span class="fe fe-options" title="Options"> </span></a>
</div>
{% if comment['replies'] -%}

5
app/templates/user/bookmarks_comments.html
View file

@ -20,7 +20,10 @@
<div class="post_list">
{% for post_reply in post_replies.items %}
{% include 'post/_post_reply_teaser.html' %}
{% with teaser=True %}
{% include 'post/_post_reply_teaser.html' %}
{% endwith %}
<hr />
{% else -%}
<p>{{ _('No comments have been bookmarked. Use the three dots on each comment to find the bookmark function.') }}</p>
{% endfor -%}

5
app/templates/user/show_profile.html
View file

@ -122,7 +122,10 @@
<h2 class="mt-4" id="comments">Comments</h2>
<div class="post_list">
{% for post_reply in post_replies.items %}
{% include 'post/_post_reply_teaser.html' %}
{% with teaser=True, disable_voting=not current_user.is_authenticated or (current_user.id != post_reply.author.id) %}
{% include 'post/_post_reply_teaser.html' %}
{% endwith %}
<hr />
{% endfor %}
</div>
<nav aria-label="{{ _('Comment pagination') }}" class="mt-4" role="navigation">