Tune editor

folkugat_web/assets/templates/fragments/tema/editor/property.html

@@ -0,0 +1,45 @@
+<form id="tema-property-{{ property.id }}"
+     class="flex flex-row items-center">
+  <div class="px-2">
+    <select name="field"
+            value="{{ property.field.value.capitalize() }}"
+            class="border border-yellow-50 focus:outline-none
+                   rounded
+                   text-yellow-50 text-center
+                   bg-brown p-1 m-0">
+      <option value="{{ property.field.value }}">
+        {{ property.field.value.capitalize() }}
+      </option>
+      {% for pf in PropertyField %}
+      {% if pf != property.field %}
+      <option value="{{ pf.value }}">
+        {{ pf.value.capitalize() }}
+      </option>
+      {% endif %}
+      {% endfor %}
+    </select>
+  </div>
+  <div class="grow mx-2">
+    <input name="value"
+           placeholder="Informació"
+           value="{{ property.value }}"
+           class="border border-beige focus:outline-none
+                  rounded w-full
+                  bg-brown px-2 py-1"
+      />
+  </div>
+  <button title="Desa els canvis"
+          class="text-sm text-beige mx-1"
+          hx-put="/api/tema/{{ tema.id }}/property/{{ property.id }}"
+          hx-target="#tema-property-{{ property.id }}"
+          hx-swap="outerHTML">
+    <i class="fa fa-check" aria-hidden="true"></i>
+  </button>
+  <button title="Descarta els canvis"
+          class="text-sm text-beige mx-1"
+          hx-get="/api/tema/{{ tema.id }}/property/{{ property.id }}"
+          hx-target="#tema-property-{{ property.id }}"
+          hx-swap="outerHTML">
+    <i class="fa fa-times" aria-hidden="true"></i>
+  </button>
+</form>