custom/plugins/EmzPlatformShippingPaymentIcons/src/Resources/views/storefront/base.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/base.html.twig' %}
  3. {% block base_footer %}
  4.     {% set footerIcons = page.footer.extensions.emzShippingPaymentIcons.get('wrapper') %}
  6.     {% if footerIcons %}
  7.         <style>
  8.             .emz-spi--wrapper {
  9.                 border-top: 1px solid #d4e2e2;
  10.             }
  12.             .emz-spi--wrapper .footer-column-content:after {
  13.                 height: auto;
  14.             }
  16.             .emz-spi--image-wrapper {
  17.                 display: flex;
  18.                 margin-top: 12px;
  19.                 justify-content: space-evenly;
  20.                 flex-wrap: wrap;
  21.             }
  23.             .emz-spi--image-wrapper .emz-spi--image-outer {
  24.                 margin-bottom: 20px;
  25.                 margin-left: 10px;
  26.                 margin-right: 10px;
  27.             }
  29.             .emz-spi--img {
  30.                 max-height: 30px;
  31.             }
  33.             .emz-spi--image-wrapper .emz-spi--image-outer .emz-spi--image{
  34.                 max-height: 100%;
  35.                 max-width: 100%;
  36.             }
  38.             @media screen and (min-width: 768px) {
  39.                 .emz-spi--image-wrapper {
  40.                     margin-top: 20px;
  41.                 }
  43.                 .emz-spi--wrapper .footer-column-content {
  44.                     height: auto;
  45.                 }
  47.                 .emz-spi--wrapper .footer-column-headline {
  48.                     display: none;
  49.                 }
  50.             }
  51.         </style>
  53.         <div class="emz-spi--wrapper">
  54.             <div class="container" data-collapse-footer="true">
  55.                 <div class="row">
  56.                     <div class="col js-footer-column">
  58.                         <div class="footer-column-headline js-footer-column-headline js-collapse-footer-column-trigger"
  59.                             data-target="#collapseEmzSPI"
  60.                             aria-controls="collapseEmzSPI">
  62.                             {{ "emz-shipping-payment-icons.footer.headline"|trans }}
  64.                             <div class="footer-column-toggle">
  65.                                 <span class="footer-plus-icon">
  66.                                     {% sw_icon 'plus' %}
  67.                                 </span>
  68.                                 <span class="footer-minus-icon">
  69.                                     {% sw_icon 'minus' %}
  70.                                 </span>
  71.                             </div>
  72.                         </div>
  74.                         <div id="collapseEmzSPI"
  75.                             class="footer-column-content js-footer-column-content collapse"
  76.                             aria-labelledby="headingEmzSPI">
  78.                             <div class="emz-spi--image-wrapper">
  80.                                 {# output of icons #}
  81.                                 {% for icon in footerIcons %}
  82.                                     {% if icon.src %}
  84.                                         <div class="emz-spi--image-outer">
  85.                                             {% sw_thumbnails 'emz-spi--image' with {
  86.                                                 media: icon.src,
  87.                                                 sizes: {
  88.                                                     'default': '100px'
  89.                                                 },
  90.                                                 attributes: {
  91.                                                     'alt': icon.alt|u.truncate(125),
  92.                                                     'title': icon.title|u.truncate(125),
  93.                                                     'class': 'emz-spi--img'
  94.                                                 }
  95.                                             } %}
  96.                                         </div>
  98.                                     {% endif %}
  99.                                 {% endfor %}
  101.                             </div>
  102.                         </div>
  103.                     </div>
  104.                 </div>
  105.             </div>
  106.         </div>
  107.     {% endif %}
  109.     {{ parent() }}
  110. {% endblock %}