Skip to content

Show inline image in replies; add icon to copy user handle #1088

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
May 10, 2025
Merged

Show inline image in replies; add icon to copy user handle #1088

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
485c908
add icon to copy user handle
May 10, 2025
0e20c2b
show images in reply
May 10, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions common/templates/_sidebar.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@
<h6 class="nickname">{{ identity.display_name }}</h6>
<div>
<span class="handler">@{{ identity.full_handle }}</span>
<span class="action inline"><span><small><a _="on click call navigator.clipboard.writeText('@{{ identity.full_handle }}') then halt"><i class="fa-regular fa-copy"></i></a></small></span></span>
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

Consider adding an aria-label attribute to the <i> tag to improve accessibility. This will provide a text alternative for screen reader users, describing the purpose of the icon. For example, aria-label="Copy user handle".

Suggested change
<span class="action inline"><span><small><a _="on click call navigator.clipboard.writeText('@{{ identity.full_handle }}') then halt"><i class="fa-regular fa-copy"></i></a></small></span></span>
<span class="action inline"><span><small><a _="on click call navigator.clipboard.writeText('@{{ identity.full_handle }}') then halt"><i class="fa-regular fa-copy" aria-label="Copy user handle"></i></a></small></span></span>

</div>
</hgroup>
</div>
Expand Down
30 changes: 23 additions & 7 deletions journal/templates/replies.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,13 +32,29 @@
{% else %}
{{ post.safe_content_local }}
{% endif %}
{% for attachment in post.attachments.all %}
<a href="{{ attachment.full_url.relative }}" class="download">
<div>
<i class="fa-solid fa-download"></i> {{ attachment.file_display_name }}
</div>
</a>
{% endfor %}
<div class="attachments">
{% for attachment in post.attachments.all %}
{% if attachment.is_image %}
<a href="#img_{{ post.pk }}_{{ loop.index }}">
<img src="{{ attachment.thumbnail_url.relative }}"
alt="image attachment"
class="preview">
</a>
<a href="#" class="lightbox" id="img_{{ post.pk }}_{{ loop.index }}">
<span style="background-image: url('{{ attachment.full_url.relative }}')"></span>
</a>
{% endif %}
Comment on lines +36 to +46
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

The lightbox implementation is basic. Consider using a JavaScript library for a more feature-rich and accessible lightbox experience. This would allow for keyboard navigation, better focus management, and smoother transitions.

{% endfor %}
{% for attachment in post.attachments.all %}
{% if not attachment.is_image %}
<a href="{{ attachment.full_url.relative }}" class="download">
<div>
<i class="fa-solid fa-download"></i> {{ attachment.file_display_name }}
</div>
</a>
{% endif %}
{% endfor %}
Comment on lines +36 to +56
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

The attachment display logic is duplicated. The code iterates through post.attachments.all twice, once for images and once for other files. Consider refactoring this into a single loop within a reusable template or function to avoid redundancy and improve maintainability. You could pass a flag to the template to indicate whether to display images or other files.

</div>
<div id="replies_{{ post.pk }}"></div>
</div>
{% empty %}
Expand Down
2 changes: 1 addition & 1 deletion neodb-takahe
Open in desktop
Submodule neodb-takahe updated 3 files
+8 −1 activities/models/post.py
+4 −2 activities/models/post_interaction.py
+0 −1 requirements-dev.lock