From: Christian Heller <c.heller@plomlompom.de>
Date: Tue, 28 Jan 2025 18:17:36 +0000 (+0100)
Subject: Improve Booking editing links bar layout.
X-Git-Url: https://plomlompom.com/repos/%7B%7B%20web_path%20%7D%7D/static/%7B%7Bprefix%7D%7D/calendar?a=commitdiff_plain;h=826f88de017f5ed29162692a20bf83d10384d4fc;p=plomledger

Improve Booking editing links bar layout.
---

diff --git a/templates/_macros.tmpl b/templates/_macros.tmpl
index 3619472..a899699 100644
--- a/templates/_macros.tmpl
+++ b/templates/_macros.tmpl
@@ -59,15 +59,16 @@ function taint() {
     el.disabled = false;
   });
   // deactivate Booking links
-  let links_text = '';
-  Array.from(document.getElementsByClassName("disable_on_change")).forEach((el) => {
-    links_text += el.textContent + ' ';
+  Array.from(document.getElementsByClassName("disable_on_change")).forEach((span) => {
+    let links_text = '';
+    Array.from(span.childNodes).forEach((node) => {
+      links_text += node.textContent + ' ';
+    });
+    span.innerHTML = '';
+    const del = document.createElement("del");
+    span.appendChild(del);
+    del.textContent = links_text;
   });
-  const span = document.getElementById('booking_links');
-  span.innerHTML = '';
-  const del = document.createElement("del");
-  span.appendChild(del);
-  del.textContent = links_text;
   // remove oninput handlers no longer needed (since we only ever go one way)
   ['input', 'textarea'].forEach((tag_name) => {
       Array.from(document.getElementsByTagName(tag_name)).forEach((el) => {
@@ -78,13 +79,13 @@ function taint() {
 {% endmacro %}
 
 {% macro edit_bar(target, id) %}
+<span class="disable_on_change">
+<a href="/bookings/{{id-1}}">prev</a> · <a href="/bookings/{{id+1}}">next</a>
+</span>
 <input class="enable_on_change" type="submit" name="apply" value="apply" disabled />
 <input class="enable_on_change" type="submit" name="revert" value="revert" disabled />
-<span id="booking_links">
-<a class="disable_on_change" href="/edit_{{target}}/{{id}}">switch to {{target}}</a>
-<a class="disable_on_change" href="/balance?up_incl={{id}}">balance after</a>
-<a class="disable_on_change" href="/bookings/{{id-1}}">prev</a>
-<a class="disable_on_change" href="/bookings/{{id+1}}">next</a>
+<span class="disable_on_change">
+<a href="/edit_{{target}}/{{id}}">switch to {{target}}</a> · <a href="/balance?up_incl={{id}}">balance after</a>
 </span>
 <hr />
 {% endmacro %}