custom/plugins/GrimmTheme/src/Resources/views/storefront/s360/megamenu/desktop/flyouts/categories.html.twig line 1

Open in your IDE?
  1. {% sw_extends '@Storefront/storefront/s360/megamenu/desktop/flyouts/categories.html.twig' %}
  3. {% block s360_megamenu_item_categories_flyout_subcategory %}
  4.     <div class="row s360-mega-menu__flyout-main-content-row">
  5.     {# only creates border background effect, no content #}
  6.     <div class="s360-menu-border-grid">
  7.         <div class="s360-menu-border-grid-col"></div>
  8.         <div class="s360-menu-border-grid-col"></div>
  9.         <div class="s360-menu-border-grid-col"></div>
  10.         <div class="s360-menu-border-grid-col"></div>
  11.     </div>
  12.         <div class="col s360-mega-menu__flyout-main-content d-flex">
  13.             {% block ss360_megamenu_item_categories_flyout_subcategory_items %}
  14.                 {{ parent() }}
  15.                 {# newsletter link und image kommen von custom field wenn nicht defined dann von snippet #}
  16.                 {% set categoryCustomFields = treeItem.item.categoryLink.translated.customFields %}
  17.                 {% set newsletter_field = categoryCustomFields.custom_category_newsletter_column %}
  18.                 {% if categoryCustomFields.custom_category_newsletter_col_is_shown %}
  19.                     <div class="s360-mega-menu__flyout__side-col">
  20.                         {# if big image selected, newsletter and lower right one wont appear #}
  21.                         {% if categoryCustomFields.custom_category_newsletter_col_big_image %}
  22.                             {% set imgId = categoryCustomFields.custom_category_newsletter_col_big_image %}
  23.                             {% if imgId %}
  24.                                 {% set mediaCollection = searchMedia([imgId], context.context) %}
  25.                                 {# extract single media object #}
  26.                                 {% set imgMedia = mediaCollection.get(imgId) %}
  27.                                 {% set bigImageLink = categoryCustomFields.custom_category_newsletter_big_image_link %}
  28.                                     
  29.                                 <div class="s360-mega-menu-side-col__big-img-wrapper">
  30.                                 {% if bigImageLink %}<a class="d-block w-100" href="{{bigImageLink}}"{% if categoryCustomFields.custom_category_newsletter_big_image_link_blank %} target="_blank"{% endif %}>{% endif %}<img src="{{imgMedia.url}}" class="img-fluid megamenu-right-col__img--big">{% if bigImageLink %}</a>{% endif %}
  31.                                 </div>
  32.                             {% endif %}
  33.                         {% else %}
  34.                             {% if newsletter_field and newsletter_field != "no-column" %}
  35.                                 <div class="s360-megamenu-newsletter-col">
  36.                                     {{ newsletter_field|raw }}
  37.                                 </div>
  38.                             {# show default newsletter #}
  39.                             {% elseif newsletter_field == null %}
  40.                                 <div class="s360-megamenu-newsletter-col">
  41.                                     <a class="s360-megamenu-newsletter-col__link" href="{{ 'newsletter.link'|trans|sw_sanitize }}">
  42.                                         <img loading="lazy" class="img-fluid" src="{{ 'newsletter.image'|trans|sw_sanitize }}" alt="newsletter">
  43.                                         <div class="d-flex align-items-start">
  44.                                             {% sw_icon 'pfeil_rechts' style {'pack': 'grimmtheme', 'namespace': 'GrimmTheme', 'size': 'xs'} %}
  45.                                             <span class="s360-megamenu-newsletter-col__text">{{ "utilities.newsletterSignup"|trans|sw_sanitize }}</span>
  46.                                         </div>
  47.                                     </a>
  48.                                 </div>
  49.                             {% endif %}
  50.                             {# image lower right corner #}
  51.                             <div class="megamenu-right-col__image-bottom-wrapper">
  52.                                 {# overwrites globally set one #}
  53.                                 {% if categoryCustomFields.custom_category_newsletter_image_bottom %}
  54.                                     {% set imgId = categoryCustomFields.custom_category_newsletter_image_bottom %}
  55.                                     {% if imgId %}
  56.                                         {% set mediaCollection = searchMedia([imgId], context.context) %}
  57.                                         {% set bottomImgMedia = mediaCollection.get(imgId) %}
  58.                                     {% endif %}
  59.                                 {% else %}
  60.                                     {% set imgId = config("GrimmTheme.config.megaMenuDefaultImage") %}
  61.                                     {% if imgId %}
  62.                                         {% set mediaCollection = searchMedia([imgId], context.context) %}
  63.                                         {% set bottomImgMedia = mediaCollection.get(imgId) %}
  64.                                     {% endif %}
  65.                                 {% endif %}
  66.                                 {% if bottomImgMedia.url %}
  67.                                     {% set rightImageLink = categoryCustomFields.custom_category_newsletter_image_bottom_right_link %}
  68.                                     {% if rightImageLink %}<a href="{{rightImageLink}}"{% if categoryCustomFields.custom_category_newsletter_image_bottom_right_blank %} target="_blank"{% endif %}>{% endif %}<img src="{{bottomImgMedia.url}}" class="img-fluid megamenu-right-col__img">{% if rightImageLink %}</a>{% endif %}
  69.                                 {% endif %}
  70.                             </div>
  71.                         {% endif %}
  72.                     </div>
  73.                 {% endif %}
  74.                 
  75.             {% endblock %}
  76.         </div>
  77.     </div>
  78. {% endblock %}