Changeset 1c6d61c in Klonkt for src/views/shell.ejs

Timestamp:

06/20/2026 08:19:11 AM (3 months ago)

Author:

roboburr <roboburr@…>

Branches:

main

Children:

cf0de0c

Parents:

4dcefa1

Message:

fix(nav): Timeline/Grid active state via aria-selected (htmx-robust)

Root cause: body-attribute CSS (body[data-feed-view]) does NOT react reliably
after an htmx OOB swap; element attributes do. Therefore the active Timeline/Grid
state is now via [aria-selected="true"] (set by syncAria, which fires on
htmx:afterSettle) instead of body[data-feed-view]. syncAria sets aria-selected
only on feed pages → on calendar/downloads/post both are grey. Template also
sets the initial aria-selected neutral on non-feed pages.

Co-Authored-By: Claude <noreply@…>

File:

• src/views/shell.ejs (modified) (1 diff)

src/views/shell.ejs

@@ -384 +384 @@
 
   function syncAria() {
+    // Alleen op een feed-pagina hoort Tijdlijn/Grid 'actief' (wit) te zijn; op
+    // agenda/downloads/post/etc. beide grijs. Inline feed-check (FEED_PAGE_CLASSES
+    // staat verderop, maar deze functie draait al bij init).
+    var _feedC = ['on-home','on-tag','on-type','on-user','on-cirkel'];
+    var _onFeed = _feedC.some(function(c){ return body.classList.contains(c); });
     document.querySelectorAll('.view-switch-btn').forEach(function(b) {
-      b.setAttribute('aria-selected', b.dataset.view === body.dataset.feedView ? 'true' : 'false');
+      b.setAttribute('aria-selected', (_onFeed && b.dataset.view === body.dataset.feedView) ? 'true' : 'false');
     });
     document.querySelectorAll('.grid-cols-btn').forEach(function(b) {