Change password as a content-shell fragment (auth /password on HX-Request).

21 lines of HTML Raw file Open on GitHub

{# Change password as a content-shell fragment (auth /password on HX-Request):
   the form + its SRP scripts + an OOB breadcrumb, swapped into #content. htmx
   executes the external scripts (allowScriptTags); srp.js is idempotent and
   password.js wires this form and, on success, navigates the pane to /account.
   The form is the shared partial — the same markup the account page's Password
   panel and the full /password page render (site/templates/_password_form.html).
   vault.js is not loaded here: it is already in the shell's <head> (base.html),
   and this fragment only ever lands inside that shell. #}
<section class="panel">
  {% include "_password_form.html" %}
</section>
<script src="{{ asset('/assets/srp.js') }}"></script>
<script src="{{ asset('/assets/password.js') }}"></script>
<nav id="crumbs" class="crumbs" aria-label="Breadcrumb" hx-swap-oob="true">
  <a href="/" hx-get="/" hx-target="#content" hx-swap="innerHTML" hx-push-url="true"><svg
     class="crumb-home" viewBox="0 0 24 24" aria-label="home"><path fill="currentColor"
     d="M12 3 2 12h3v8h5v-5h4v5h5v-8h3z"/></svg></a>
  <span class="crumb-sep" aria-hidden="true">&#8250;</span>
  <span class="crumb-leaf">change password</span>
</nav>
<div id="actions" class="actions" hx-swap-oob="true"></div>