templates/catalog/snippets/modal.html.twig line 1

Open in your IDE?
  1. <!-- Modal -->
  3. <div class="modal border-0 fade pr-0 catalog-modal" id="catalogModal-{{ article is defined ? article.id }}" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  4.     <div class="modal-dialog modal-lg modal-dialog-centered" role="document" style="max-width: 680px;">
  5.         <div class="modal-content">
  6.             <div class="modal-header border-0">
  7.                 <button type="button" class="close" data-dismiss="modal" aria-label="Close" style="opacity: 1;">
  8.                 <span aria-hidden="true" class="text-indigo">&times;</span>
  9.                 </button>
  10.             </div>
  11.             <div class="modal-body px-5 px-lg-5 px-md-5">
  12.                 <div class="row">
  13.                     {% if addresses is defined and addresses and not lastCatalog %}
  14.                         <div class="col-lg-6">
  15.                             <h3 class="font-weight-bold mb-3 mb-lg-3 mb-md-3">Order Print Catalog</h3>
  16.                             <div class="order-catalog-text">
  17.                                 <small class="font-weight-bold text-silver">
  18.                                     DEFAULT SHIPPING ADDRESS
  19.                                 </small>
  20.                             </div>
  22.                             {% for address in addresses %}
  23.                                 <div class="{{ defaultShippingAddress != address.id ? 'd-none' }}" data-address-id="{{ address.id }}">
  24.                                     <p class="mb-0 text-deepGray mt-3 mt-lg-3 mt-md-3">{{ address.fullname }}</p>
  25.                                     <p class="mb-0 text-deepGray">{{ address.street_address }}</p>
  26.                                     <p class="mb-0 text-deepGray">{{ address.zip_code }} {{ address.city }}</p>
  27.                                     <p class="mb-0 text-deepGray">{{ address.stateDisplay }}</p>
  28.                                     <p class="mb-0 text-deepGray">{{ address.countryName }}</p>
  29.                                     <p class="mb-0 text-deepGray">{{ address.phone }}</p>
  30.                                 </div>
  31.                             {% endfor %}
  32.                             <div class="select-ghost" style="margin-left: -27px;">
  33.                                 <select name="catalog_shipping_addresses" id="catalog_shipping_addresses-{{article.id}}" style="max-width: 200px;">
  34.                                     {% if addresses is defined %}
  35.                                         <option value="" disabled selected>
  36.                                             SELECT OTHER ADDRESS
  37.                                         </option>
  38.                                         {% for address in addresses %}
  39.                                             <option value="{{ address.id }}">
  40.                                                 {{ address.label }}
  41.                                             </option>
  42.                                         {% endfor %}
  43.                                     {% endif %}
  44.                                         <option value="new">{{ 'Add new' | trans }}</option>
  45.                                 </select>
  46.                             </div>
  47.                         </div>
  48.                     {% else %}
  49.                         <div class="col-lg-6">
  50.                             <h3 class="font-weight-bold mb-3 mb-lg-3 mb-md-3">Order Print</h3>
  51.                             <div class="order-catalog-text">
  52.                                 <p>Please complete the form to receive your free product catalog from Stoelting Co.</p>
  53.                             </div>
  54.                         </div>
  55.                     {% endif %}
  56.                     <div class="col-lg-6 d-flex justify-content-center">
  57.                         {{ article.feature_image.getThumbnail('catalog').getHtml({class: 'mb-2 mb-lg-2 mb-md-2', alt: article.title}) | raw }}
  58.                     </div>
  59.                 </div>
  60.                 <div class="row">
  61.                     <div class="col-lg-12">
  62.                         {% include 'catalog/snippets/form.html.twig' with modalForms[article.id] %}
  63.                     </div>
  64.                 </div>
  65.             </div>
  66.             <div class="modal-footer border-0 mb-3 mb-lg-3 mb-md-3 px-5 px-lg-5 px-md-5 {{ not addresses or lastCatalog ? 'd-none' }}">
  67.                 <!-- <a class="btn btn-primary btn-primary--ghost" data-dismiss="modal">
  68.                     Anwser no
  69.                 </a> -->
  70.                 <form action="{{ path('catalog_email_send', {'division': getSiteDivision()}) }}" method="POST" class="m-0 d-flex w-100 align-items-end">
  71.                     <div class="d-flex flex-column mr-auto">
  72.                         <div class="mb-1 mb-lg-1 mb-md-1 text-deepGray">
  73.                             Quantity
  74.                         </div>
  75.                         <div class="border border-pearl d-flex custom-input-number" style="width: 105px;">
  76.                             <button type="button" disabled="disabled" class="custom-input-number-button custom-input-number-button--down"><span class="custom-input-number-arrow"></span></button>
  77.                                 <input type="number" class="text-deepGray" id="quantity-{{ article.id }}" name="quantity" required="required" placeholder="stoelting.quantity" min="1" max="100" value="1">
  78.                             <button type="button" class="custom-input-number-button custom-input-number-button--up"><span class="custom-input-number-arrow custom-input-number-arrow--up"></span></button>
  79.                         </div>
  80.                     </div>
  81.                     <input type="text" name="address" value="{{ defaultShippingAddress }}" hidden>
  82.                     <input type="text" name="catalog" value="{{ article.id }}" hidden>
  83.                     <button type="submit" class="btn btn-primary ml-4 ml-lg-0 ml-md-0" >
  84.                         Submit
  85.                     </button>
  86.                 </form>
  87.             </div>
  88.         </div>
  89.     </div>
  90. </div>