{# Apply saved theme before render to avoid flash #} {# Inter font #} {# HTMX #} {% if htmx_local %} {% else %} {% endif %} {% for css_url in extra_css %} {% endfor %} {# Alpine.js 3.x — deferred so inline alpine:init listeners fire after CSS #} {% for js_url in extra_js %} {% endfor %} {# Catalyst-inspired layout - Sidebar: always secondary-950 (dark), regardless of colour scheme - Content: white (light) / secondary-900 (dark) #} {# ─── Mobile backdrop ─────────────────────────────────────────────── #}
{# ─── Sidebar ───────────────────────────────────────────────────────── #} {# ─── Main content ────────────────────────────────────────────────── #}
{# Top header strip #}
{# Hamburger — mobile only #}
{# Right side: user menu + theme toggle #}
{% if auth_enabled and current_user %} {# User avatar dropdown — self-contained Alpine component #}
{# Dropdown #}
{{ current_user.username[0] | upper }}

{{ current_user.username }}

Administrator

{% endif %} {# Theme toggle #}
{# Flash messages #}
{% block flash %}{% endblock %}
{# Page content #}
{% if self.breadcrumb() %}
{% block breadcrumb %}{% endblock %}
{% endif %} {% if self.page_heading() or self.header_actions() %}
{% block page_heading %}{% endblock %}
{% block header_actions %}{% endblock %}
{% endif %} {% block content %}{% endblock %}
{# ─── Unified Dialog ───────────────────────────────────────────────── #} {# Single Alpine component for all dialog types: mode='form' — action form with dynamic fields (dispatched via ap-action-trigger) mode='confirm' — styled confirmation prompt (dispatched via ap-confirm-request) mode='alert' — informational/error notice (dispatched via ap-alert-request) Confirmation and alert dialogs are Promise-based: the dispatcher passes a `resolve` callback in the event detail which is called with true/false. Global helpers available on window after alpine:init: await apConfirm(message, { title, variant, confirmLabel, cancelLabel }) await apAlert(message, { title, variant, confirmLabel }) #}
{# ── Header ── #}
{# Confirm / warning icon #} {# Danger icon #} {# Success icon #} {# Info icon #}

{# Close button — hidden for alert (must use OK) #}
{# ── Body + Footer wrapped in a form so the submit button works ── #}
{# Message line (confirm / alert) #}

{# Dynamic form fields (form mode only) #}
{# ── Footer ── #}
{# Cancel — hidden for alert mode #} {# Submit — form mode only #} {# Confirm / OK — confirm and alert modes #}