feat: graceful no-JS fallback and noscript handling

- Add <noscript><style> in base.njk that unhides x-cloak/x-show content,
  hides FAB and tab buttons when JS is disabled (content stacks instead)
- Add noscript message on search page with links to blog/categories
- Add noscript banner on interactions page explaining inbound tab needs JS
This commit is contained in:
Ricardo
2026-02-19 17:35:21 +01:00
parent 03ace58be5
commit 656a70eb0e
3 changed files with 27 additions and 0 deletions

View File

@@ -8,6 +8,12 @@ permalink: /interactions/
<p class="text-surface-600 dark:text-surface-400">Activity across the IndieWeb - both my engagement and responses to my content.</p>
</div>
<noscript>
<div class="p-4 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-800 rounded-lg mb-6">
<p class="text-amber-800 dark:text-amber-200 text-sm">The inbound webmentions tab requires JavaScript to load data from the API. Enable JavaScript for the full interactive experience. Outbound interactions are shown below.</p>
</div>
</noscript>
{# Tab navigation for Outbound/Inbound #}
<div x-data="interactionsApp()" x-init="init()">
{# Tab buttons #}