mirror of
https://codeberg.org/rimu/pyfedi
synced 2025-01-23 19:36:56 -08:00
aria role tree for comments
This commit is contained in:
parent
a8c79c7405
commit
3780a74755
5 changed files with 13 additions and 13 deletions
|
@ -1,14 +1,14 @@
|
|||
{% if current_user.is_authenticated and current_user.verified %}
|
||||
{% if can_upvote(current_user, community) %}
|
||||
<div class="upvote_button {{ upvoted_class }}" role="button" aria-label="{{ _('UpVote') }}"
|
||||
<div class="upvote_button {{ upvoted_class }}" role="button" aria-label="{{ _('UpVote') }}" aria-live="assertive"
|
||||
hx-post="/comment/{{ comment.id }}/upvote" hx-trigger="click throttle:1s" hx-target="closest .voting_buttons_new" tabindex="0">
|
||||
<span class="fe fe-arrow-up"></span>
|
||||
<img class="htmx-indicator" src="/static/images/spinner.svg" alt="" style="opacity: 0;">
|
||||
</div>
|
||||
{% endif %}
|
||||
<span title="{{ comment.up_votes }}, {{ comment.down_votes }}">{{ comment.up_votes - comment.down_votes }}</span>
|
||||
<span title="{{ comment.up_votes }}, {{ comment.down_votes }}" aria-live="assertive">{{ comment.up_votes - comment.down_votes }}</span>
|
||||
{% if can_downvote(current_user, community) %}
|
||||
<div class="downvote_button {{ downvoted_class }}" role="button" aria-label="{{ _('DownVote') }}"
|
||||
<div class="downvote_button {{ downvoted_class }}" role="button" aria-label="{{ _('DownVote') }}" aria-live="assertive"
|
||||
hx-post="/comment/{{ comment.id }}/downvote" hx-trigger="click throttle:1s" hx-target="closest .voting_buttons_new" tabindex="0">
|
||||
<span class="fe fe-arrow-down"></span>
|
||||
<img class="htmx-indicator" src="/static/images/spinner.svg" alt="" style="opacity: 0;">
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
{% if current_user.is_authenticated and current_user.verified %}
|
||||
{% if can_upvote(current_user, post.community) %}
|
||||
<div class="upvote_button {{ upvoted_class }}" role="button" aria-label="{{ _('UpVote') }}"
|
||||
<div class="upvote_button {{ upvoted_class }}" role="button" aria-label="{{ _('UpVote') }}" aria-live="assertive"
|
||||
hx-post="/post/{{ post.id }}/upvote" hx-trigger="click throttle:1s" hx-target="closest .voting_buttons" tabindex="0">
|
||||
<span class="fe fe-arrow-up"></span>
|
||||
{{ shorten_number(post.up_votes) }}
|
||||
|
@ -8,7 +8,7 @@
|
|||
</div>
|
||||
{% endif %}
|
||||
{% if can_downvote(current_user, post.community) %}
|
||||
<div class="downvote_button {{ downvoted_class }}" role="button" aria-label="{{ _('DownVote') }}"
|
||||
<div class="downvote_button {{ downvoted_class }}" role="button" aria-label="{{ _('DownVote') }}" aria-live="assertive"
|
||||
hx-post="/post/{{ post.id }}/downvote" hx-trigger="click throttle:1s" hx-target="closest .voting_buttons" tabindex="0">
|
||||
<span class="fe fe-arrow-down"></span>
|
||||
{{ shorten_number(post.down_votes) }}
|
||||
|
|
|
@ -1,13 +1,13 @@
|
|||
{% if current_user.is_authenticated and current_user.verified %}
|
||||
{% if can_upvote(current_user, post.community) %}
|
||||
<div class="upvote_button {{ upvoted_class }}" role="button" aria-label="{{ _('UpVote') }}"
|
||||
<div class="upvote_button {{ upvoted_class }}" role="button" aria-label="{{ _('UpVote') }}" aria-live="assertive"
|
||||
hx-post="/post/{{ post.id }}/upvote?style=masonry" hx-trigger="click throttle:1s" hx-target="closest .voting_buttons_masonry" tabindex="0" title="{{ post.up_votes }} upvotes">
|
||||
<span class="fe fe-arrow-up"></span>
|
||||
<img class="htmx-indicator" src="/static/images/spinner.svg" alt="" style="opacity: 0;">
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if can_downvote(current_user, post.community) %}
|
||||
<div class="downvote_button {{ downvoted_class }}" role="button" aria-label="{{ _('DownVote') }}"
|
||||
<div class="downvote_button {{ downvoted_class }}" role="button" aria-label="{{ _('DownVote') }}" aria-live="assertive"
|
||||
hx-post="/post/{{ post.id }}/downvote?style=masonry" hx-trigger="click throttle:1s" hx-target="closest .voting_buttons_masonry" tabindex="0" title="{{ post.down_votes }} downvotes">
|
||||
<span class="fe fe-arrow-down"></span>
|
||||
<img class="htmx-indicator" src="/static/images/spinner.svg" alt="" style="opacity: 0;">
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
<div class="row post_replies">
|
||||
<div class="col">
|
||||
{% macro render_comment(comment) %}
|
||||
<div id="comment_{{ comment['comment'].id }}" class="comment {% if comment['comment'].author.id == post.author.id %}original_poster{% endif %}">
|
||||
<div id="comment_{{ comment['comment'].id }}" class="comment {% if comment['comment'].author.id == post.author.id %}original_poster{% endif %}" role="treeitem">
|
||||
<div class="limit_height">
|
||||
<div class="comment_author">
|
||||
{% if comment['comment'].author.deleted %}
|
||||
|
@ -70,7 +70,7 @@
|
|||
<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'] %}
|
||||
<div class="replies hidable">
|
||||
<div class="replies hidable" role="group">
|
||||
{% for reply in comment['replies'] %}
|
||||
{{ render_comment(reply) | safe }}
|
||||
{% endfor %}
|
||||
|
@ -78,7 +78,7 @@
|
|||
{% endif %}
|
||||
</div>
|
||||
{% endmacro %}
|
||||
<div id="replies" class="comments">
|
||||
<div id="replies" class="comments" role="tree">
|
||||
{% for reply in replies %}
|
||||
{{ render_comment(reply) | safe }}
|
||||
{% endfor %}
|
||||
|
|
|
@ -66,7 +66,7 @@
|
|||
</div>
|
||||
{% macro render_comment(comment) %}
|
||||
<div id="comment_{{ comment['comment'].id }}" class="comment {% if comment['comment'].score <= -10 %}low_score{% endif %}
|
||||
{% if comment['comment'].author.id == post.author.id %}original_poster{% endif %}">
|
||||
{% if comment['comment'].author.id == post.author.id %}original_poster{% endif %}" aria-level="{{ comment['comment'].depth + 1 }}" role="treeitem">
|
||||
<div class="limit_height">
|
||||
<div class="comment_author">
|
||||
{% if comment['comment'].author.deleted %}
|
||||
|
@ -124,7 +124,7 @@
|
|||
</div>
|
||||
{% if comment['replies'] %}
|
||||
{% if comment['comment'].depth <= THREAD_CUTOFF_DEPTH %}
|
||||
<div class="replies hidable">
|
||||
<div class="replies hidable" role="group">
|
||||
{% for reply in comment['replies'] %}
|
||||
{{ render_comment(reply) | safe }}
|
||||
{% endfor %}
|
||||
|
@ -144,7 +144,7 @@
|
|||
{% endif %}
|
||||
{% endmacro %}
|
||||
|
||||
<div id="replies" class="comments">
|
||||
<div id="replies" class="comments" role="tree" aria-label="{{ _('Comments') }}">
|
||||
{% for reply in replies %}
|
||||
{{ render_comment(reply) | safe }}
|
||||
{% endfor %}
|
||||
|
|
Loading…
Reference in a new issue