{% extends "_base.html" %} {% block title %}Embeddable Forms{% endblock %} {%
block heading %}Embeddable Forms{% endblock %} {% block extra_styles %}
<link rel="stylesheet" href="/static/css/admin.css" /> {% endblock %} {% block
content %}
<div class="settings-management">
  <div id="contactForm" style="display: flex; justify-content: space-between">
    <div id="contactFormSettings" style="min-height: 300px">
      <h2>Contact Form</h2>
      <p>
        Use the following HTML code to embed the contact form on other websites:
      </p>
      <div class="embed-config">
        <label
          >Width: <input id="contactWidth" type="text" value="400"
        /></label>
        <label
          >Height: <input id="contactHeight" type="text" value="600"
        /></label>
        <button
          class="btn btn-primary"
          onclick="saveEmbedSetting('embed_contact_width','contactWidth')"
        >
          Save
        </button>
        <button
          class="btn btn-primary"
          onclick="saveEmbedSetting('embed_contact_height','contactHeight')"
        >
          Save
        </button>
      </div>
      <textarea id="iframeCode" class="iframe-code" readonly></textarea>
      <button class="btn btn-secondary" onclick="copyIframeCode()">
        Copy Contact Iframe
      </button>
    </div>
    <div id="contactFormPreview"></div>
  </div>
</div>

<div class="settings-management">
  <div
    id="newsletterForm"
    style="display: flex; justify-content: space-between"
  >
    <div id="newsletterFormSettings" style="min-height: 400px">
      <h2>Newsletter Subscription Form</h2>
      <p>
        Use the following HTML code to embed the newsletter subscription form on
        other websites:
      </p>
      <div class="embed-config">
        <label
          >Width: <input id="newsletterWidth" type="text" value="600"
        /></label>
        <label
          >Height: <input id="newsletterHeight" type="text" value="300"
        /></label>
        <button
          class="btn btn-primary"
          onclick="saveEmbedSetting('embed_newsletter_width','newsletterWidth')"
        >
          Save
        </button>
        <button
          class="btn btn-primary"
          onclick="saveEmbedSetting('embed_newsletter_height','newsletterHeight')"
        >
          Save
        </button>
      </div>
      <textarea
        id="iframeNewsletterCode"
        class="iframe-code"
        readonly
      ></textarea>
      <button class="btn btn-secondary" onclick="copyNewsletterIframeCode()">
        Copy Newsletter Iframe
      </button>
      </div>
      <div id="newsletterFormPreview"></div>
    </div>
  </div>
  <div class="settings-management">
    <p>
      Replace <code>http://your-server-domain</code> with your actual server
      domain and port (e.g., https://yourdomain.com).
    </p>
  </div>
  {% endblock %} {% block extra_scripts %}
  <script src="/static/js/admin.js"></script>
  {% endblock %}
</div>