Compact interfaces and edit more things inline

core/templates/mixins/window-content/queue-form-inline.html

@@ -0,0 +1,44 @@
+{% include "mixins/partials/notify.html" %}
+{% if page_title is not None %}
+  <h1 class="title is-4">{{ page_title }}</h1>
+{% endif %}
+{% if page_subtitle is not None %}
+  <h1 class="subtitle">{{ page_subtitle }}</h1>
+{% endif %}
+{% load crispy_forms_tags %}
+
+<form
+  id="queue-inline-form-{{ object.id }}"
+  data-inline-target="{{ submit_target|default:'#modals-here' }}"
+  hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
+  hx-post="{{ submit_url }}"
+  hx-target="{{ submit_target|default:'#modals-here' }}"
+  hx-swap="innerHTML">
+  {% csrf_token %}
+  {% for hidden in form.hidden_fields %}
+    {{ hidden }}
+  {% endfor %}
+  {% if form.non_field_errors %}
+    <article class="message is-danger">
+      <div class="message-body">{{ form.non_field_errors }}</div>
+    </article>
+  {% endif %}
+  {{ form|crispy }}
+  <div class="buttons are-small" style="margin-bottom: 0;">
+    {% if is_inline_edit %}
+      <button
+        type="button"
+        class="button is-light"
+        onclick="(function(){const f=document.getElementById('queue-inline-form-{{ object.id }}'); if(!f){return;} const target=f.dataset.inlineTarget; const host=target ? document.querySelector(target) : null; if(host){host.innerHTML=''; host.style.display='none';}})(); return false;">
+        Cancel
+      </button>
+    {% elif hide_cancel is not True %}
+      <button
+        type="button"
+        class="button is-light modal-close-button">
+        Cancel
+      </button>
+    {% endif %}
+    <button type="submit" class="button modal-close-button">Save</button>
+  </div>
+</form>