{# The shell every page is wrapped in. Rendered by sw.js, not by the build, so editing this file changes every page without regenerating any of them. Context: title, content (safe HTML fragment), mark (bookmark or null), reference (the navbar picker's model, or null). Bootstrap is the whole stylesheet. The fragments carry semantic USFM classes and no Bootstrap ones, so the body text is styled by Reboot; the chrome here is what uses the framework. #} {# No viewport-fit=cover, deliberately. It extends the page into the notch and the home indicator, which only makes sense paired with safe-area-inset padding in the stylesheet -- and without that padding on iOS the first line of scripture sits under the clock. Paired with the status bar style below: change one and the other has to change too. #} {% block title %}{{ title | safe }}{% endblock %} {# Vendored rather than linked from a CDN: sw.js only caches same-origin responses, so a CDN stylesheet would leave the app unstyled offline. #} {# app.css comes second so its variable overrides win. It styles the scripture; Bootstrap styles the chrome. #} {# History entries are whole books, and htmx keeps its history cache in localStorage -- a couple of them would blow the quota. Turned off, so every back or forward is a cache miss, and refreshOnHistoryMiss decides what a miss does. False on purpose. True makes htmx call location.reload(true) -- a forced reload, which is exactly the kind of navigation a browser takes past the service worker, so it reaches server.py and comes back as boot.html: the spinner flashes by and then reloads into the real page. False makes htmx fetch the page over XHR instead, which the worker answers itself, from its own cache when offline. No navigation, no boot page, nothing to flash. That request carries HX-History-Restore-Request, and the worker answers it with a whole composed document; htmx lifts the element marked hx-history-elt out of the response and puts it back in the page. #} {# The bundle carries Popper, which the navbar collapse and the modal do not need -- but a dropdown or tooltip added later would, and this is one file in the precache either way. Deferred scripts run in order, so `bootstrap` is defined by the time app.js runs. #} {# htmx is not deferred: hx-boost has to be in place before the first click. #} {# black, not black-translucent. Translucent makes iOS draw the status bar over the web view and reserve no space for it, so the navbar starts at the very top of the screen with the clock and battery on top of it. black keeps the status bar opaque and the view below it, which is what this app wants: there is no full-bleed artwork here to show through. #} {# Boosted links swap only the fragment, so the navbar, the modal and the scripts above survive navigation and never reload. No show: modifier, deliberately. htmx adds show:top itself for a boosted link, but skips it when the href carries a fragment identifier and scrolls to that anchor after the swap instead. Spelling show:top out here overrides that decision for every link, which leaves a cross-reference like ISA#v61_6 sitting at the top of Isaiah. #} {# col-xl-8 keeps a line of verse near a readable measure instead of running the full width of a desktop window. #}
{# The swap target. hx-target on names this id, so every boosted link lands here -- remove it and a click does nothing at all while a full navigation still works. #}
{% block content %}{% endblock %}
{% include "version.njk" %}
{# Chrome, so it is written once here instead of built in JavaScript on every page. app.js only fills in the verse it was opened for and shows it. #}