fix: pagination, headers, avatars, tab order, and notification UI

- Fix cursor pagination: use string comparison (not Date objects) for
  published field queries in both timeline and notifications
- Fix "Older" cursor to use oldest item's date, not newest
- Remove redundant parent breadcrumb from all AP page headings
- Reorder tabs: Notes first, All last
- Fix avatar loading: non-destructive hide/show with lazy loading
- Add actor avatars with type badge overlay to notification cards
- Add Fediverse navigation group in sidebar
This commit is contained in:
Ricardo
2026-02-21 20:28:40 +01:00
parent 937c0a8226
commit 31418310d2
18 changed files with 78 additions and 74 deletions

View File

@@ -24,8 +24,9 @@
{# Author header #}
<header class="ap-card__author">
{% if item.author.photo %}
<img src="{{ item.author.photo }}" alt="{{ item.author.name }}" class="ap-card__avatar"
onerror="this.replaceWith(Object.assign(document.createElement('span'),{className:'ap-card__avatar ap-card__avatar--default',textContent:'{{ item.author.name[0] | upper if item.author.name else "?" }}'}))">
<img src="{{ item.author.photo }}" alt="{{ item.author.name }}" class="ap-card__avatar" loading="lazy" crossorigin="anonymous"
onerror="this.style.display='none';this.nextElementSibling.style.display=''">
<span class="ap-card__avatar ap-card__avatar--default" style="display:none" aria-hidden="true">{{ item.author.name[0] | upper if item.author.name else "?" }}</span>
{% else %}
<span class="ap-card__avatar ap-card__avatar--default" aria-hidden="true">{{ item.author.name[0] | upper if item.author.name else "?" }}</span>
{% endif %}

View File

@@ -8,19 +8,18 @@
<button type="submit" class="ap-notification__dismiss-btn" title="{{ __('activitypub.notifications.dismiss') }}">&times;</button>
</form>
{# Type icon #}
<div class="ap-notification__icon">
{% if item.type == "like" %}
{% elif item.type == "boost" %}
🔁
{% elif item.type == "follow" %}
👤
{% elif item.type == "reply" %}
💬
{% elif item.type == "mention" %}
@
{# Actor avatar with type badge #}
<div class="ap-notification__avatar-wrap">
{% if item.actorPhoto %}
<img src="{{ item.actorPhoto }}" alt="{{ item.actorName }}" class="ap-notification__avatar" loading="lazy" crossorigin="anonymous"
onerror="this.style.display='none';this.nextElementSibling.style.display=''">
<span class="ap-notification__avatar ap-notification__avatar--default" style="display:none" aria-hidden="true">{{ item.actorName[0] | upper if item.actorName else "?" }}</span>
{% else %}
<span class="ap-notification__avatar ap-notification__avatar--default" aria-hidden="true">{{ item.actorName[0] | upper if item.actorName else "?" }}</span>
{% endif %}
<span class="ap-notification__type-badge">
{% if item.type == "like" %}❤{% elif item.type == "boost" %}🔁{% elif item.type == "follow" %}👤{% elif item.type == "reply" %}💬{% elif item.type == "mention" %}@{% endif %}
</span>
</div>
{# Notification body #}