casper-modified-ghost-theme/partials/isso-scripts.hbs

<style>
  .post-action {
    margin-top: -3rem !important;
  }
</style>
<script>
  function addCheckbox(container = document) {
    const original_submit = container.querySelector(
      ".post-action input[type='submit']"
    );
    original_submit.style.setProperty("display", "none");
    const faux_submit = document.createElement("input");
    faux_submit.value = "Wyślij";
    faux_submit.type = "submit";
    const comment_checkbox_id = "comment-checkbox";
    const checkbox = document.createElement("input");
    checkbox.type = "checkbox";
    checkbox.id = comment_checkbox_id;
    checkbox.required = true;
    const label = document.createElement("label");
    label.style.setProperty("line-height", 1);
    label.style.setProperty("margin", "1em 0");
    label.for = comment_checkbox_id;
    label.appendChild(checkbox);
    label.id = comment_checkbox_id + "__label";
    const label_text = document.createElement("span");
    label_text.innerHTML = `Zapoznałam/em się z <a href="/regulamin-komentarzy">Regulaminem publikowania komentarzy</a> i&nbsp;akceptuję jego treść.`;
    label.appendChild(label_text);
    container
      .querySelector("#isso-thread .auth-section")
      .insertBefore(
        label,
        container.querySelector(".auth-section .post-action")
      );
    const legal = document.createElement("p");
    legal.classList.add("legal");
    legal.innerHTML = `Administratorem danych osobowych jest Fundacja Internet. Czas działać! Dane osobowe podane w formularzu są przetwarzane w celu realizacji usługi publikowania komentarzy na stronie internetowej administratora danych osobowych, jak również w celu ustalenia, dochodzenia lub obrony roszczeń. Masz w szczególności prawo dostępu do swoich danych osobowych, ich usunięcia oraz wniesienia sprzeciwu wobec przetwarzania danych. Szczegóły dotyczące przetwarzania danych osobowych i przysługujących Ci praw znajdują się w <a href="/polityka-prywatnosci">Polityce prywatności</a>.`;
    legal.style.setProperty("hyphens", "auto");
    legal.style.setProperty("text-align", "justify");
    legal.style.setProperty("font-style", "italic");
    legal.style.setProperty("font-size", "1.333rem");
    legal.style.setProperty("line-height", "150%");
    legal.style.setProperty("padding-bottom", "3rem");
    container
      .querySelector("#isso-thread .auth-section")
      .insertBefore(
        legal,
        container.querySelector(".auth-section .post-action")
      );
    const email_input = container.querySelector(`input[type="email"]`);
    email_input.placeholder = "adres E-mail";
    email_input.required = true;
    faux_submit.addEventListener("click", () => {
      if (!email_input.validity.valid) {
        email_input.reportValidity();
      } else if (!checkbox.checked) {
        checkbox.reportValidity();
      } else {
        original_submit.click();
      }
    });
    original_submit.parentElement.appendChild(faux_submit);
  }

  async function waitForSelector(selector) {
    for (let i = 0; i <= 100; i++) {
      if (document.querySelector(selector)) {
        break;
      }
      await new Promise((resolve) => setTimeout(resolve, 200));
    }
  }

  (async function () {
    await waitForSelector(".post-action input[type='submit']");
    addCheckbox(document.querySelector("#isso-thread"));
    await waitForSelector(".isso-comment-footer a.reply");
    document.querySelectorAll(".isso-comment-footer a.reply").forEach((el) =>
      el.addEventListener("click", (e) =>
        setTimeout(() => {
          addCheckbox(e.target.parentNode.nextSibling);
        }, 20)
      )
    );
  })();
</script>