Better

assets/templates/bookmark.njk

@@ -0,0 +1,27 @@
+{# The navbar's bookmark slot. Rendered into the shell with whatever mark the
+   worker holds, and returned on its own by api/bookmark after a write. Both
+   paths must produce the same element for the swap to be seamless.
+
+   mark is null in one case only: boot.html composed this page, so there was
+   no worker to ask. The slot is then hidden rather than absent and fetches
+   itself once app.js reports a worker is controlling -- which is why the htmx
+   attributes are on the empty state and not the filled one. A filled slot is
+   only ever replaced by the modal's form, which names #bookmark itself.
+
+   Empty state is d-none, not the hidden attribute: Bootstrap declares .d-flex
+   after Reboot's [hidden] rule, both !important and at the same specificity,
+   so the utility would win. #}
+<span class="bookmark navbar-text {% if mark %}d-flex{% else %}d-none{% endif %} align-items-center gap-2"
+      id="bookmark"
+      {%- if not mark %}
+      hx-get="api/bookmark" hx-trigger="worker-ready from:body"
+      hx-target="this" hx-swap="outerHTML"
+      {%- endif %}>
+{%- if mark %}
+  <span class="bookmark-label badge text-bg-secondary">Bookmark</span>
+  {# Not boosted: a real navigation lets the browser scroll to the verse
+     anchor, which a swap into #content would not do. #}
+  <a class="bookmark-link link-light text-truncate" href="{{ mark.href }}"
+     hx-boost="false">{{ mark.ref }}</a>
+{%- endif %}
+</span>