{% load i18n %}

<div class='modal fade modal-image' role='dialog' id='modal-image-dialog'>
  <span class='modal-close' id='modal-image-close'>&times;</span>

  <img class='modal-image-content' alt='{% trans "Image" %}' id='modal-image'>

</div>

<div class='modal fade modal-fixed-footer modal-primary inventree-modal' role='dialog' id='modal-form' tabindex='-1'>
    <div class='modal-dialog'>
        <div class='modal-content'>
            <div class="modal-header">
              <h4 id='modal-title'><em>Form Title Here</em></h4>
              <button type='button' class='btn-close' data-bs-dismiss='modal' aria-label='{% trans "Close" %}'></button>
            </div>
            <div class='modal-form-content-wrapper'>
              <div class='alert alert-block alert-danger' id='form-validation-warning' style='display: none;'>
                {% trans "Form errors exist" %}
              </div>
              <div class='modal-form-content'>
                <!-- Form content will be injected here-->
              </div>
            </div>
            <div class='modal-footer'>
                <div id='modal-footer-buttons'></div>
                <button type='button' class='btn btn-outline-secondary' id='modal-form-close' data-bs-dismiss='modal'>{% trans "Close" %}</button>
                <button type='button' class='btn btn-primary' id='modal-form-submit'>{% trans "Submit" %}</button>
            </div>
        </div>
    </div>
</div>

<div class='modal fade modal-fixed-footer modal-secondary' role='dialog' id='modal-form-secondary'>
        <div class='modal-dialog'>
            <div class='modal-content'>
                <div class="modal-header">
                  <h4 id='modal-title'><em>Form Title Here</em></h4>
                  <button type='button' class='btn-close' data-bs-dismiss='modal' aria-label='{% trans "Close" %}'></button>
                </div>
                <div class='modal-form-content-wrapper'>
                  <div class='alert alert-block alert-danger' id='form-validation-warning' style="display: none;">
                    {% trans "Form errors exist" %}
                  </div>
                  <div class='modal-form-content'>
                  </div>
                </div>
                <div class='modal-footer'>
                    <div id='modal-footer-buttons'></div>
                    <button type='button' class='btn btn-outline-secondary' id='modal-form-close' data-bs-dismiss='modal'>{% trans "Close" %}</button>
                    <button type='button' class='btn btn-primary' id='modal-form-submit'>{% trans "Submit" %}</button>
                </div>
            </div>
        </div>
    </div>