themes/BootstrapChildTheme/SyliusShopBundle/views/Product/index.html.twig line 38

Open in your IDE?
  1. {% extends '@SyliusShop/layout.html.twig' %}
  3. {% set taxon = get_taxon_by_slug(app.request.attributes.get('slug'), sylius.localeCode) %}
  4. {% set menuTaxons = get_menu_taxon_by_slug(taxon, sylius.localeCode) %}
  6. {% block stylesheets %}
  7.     {{ parent() }}
  8.     {{ encore_entry_link_tags('shop-category-view', null, 'bootstrapTheme') }}
  9. {% endblock %}
  11. {% block javascripts %}
  12.     {{ parent() }}
  13.     {{ encore_entry_script_tags('shop-category-view', null, 'bootstrapTheme') }}
  14. {% endblock %}
  16. {% block title %}
  17.     {{ sylius_template_event('dedi_sylius_seo_plugin.title', { resource: taxon ?? product ?? sylius.channel, title: taxon }) }}
  18. {% endblock %}
  20. {% block breadcrumb %}
  21.     {% include '@SyliusShop/Taxon/_breadcrumb.html.twig' %}
  22. {% endblock %}
  24. {% block content %}
  25.     {#{% include '@SyliusShop/Product/Index/_header.html.twig' %}#}
  27.     {% include '@SyliusShop/_tracking/data_layer.html.twig' %}
  30.     {% if taxon.isRoot() and taxon.code  %}
  31.         <div class="catalog catalog-all">
  32.             {% include '@SyliusShop/Product/Index/_all_categories.html.twig' with { 'taxon': taxon } %}
  33.         </div>
  34.     {% elseif taxon.parent and not taxon.parent.isRoot() %}
  36.         <div class="row taxons">
  37.             <div class="d-none d-md-block col-md-4 col-lg-3 col-xl-3 col-xxl-2">
  38.                 {% include '@SyliusShop/Product/Index/_sidebar.html.twig' %}
  39.             </div>
  40.             <div class="col-12 col-md-8 col-lg-9 col-xxl-10">
  41.                 <h1 class="taxon-title">{{ taxon.name }}</h1>
  42.                 {% if taxon.description %}
  43.                     <div class="taxon-description">{{ taxon.description }}</div>
  44.                 {% endif %}
  46.                 {% set taxonChildren = taxon.children  %}
  47.                 {% if taxonChildren|length %}
  48.                     <h4 class="title d-md-none">{{ 'app.ui.taxon.subtaxons' | trans }}</h4>
  50.                     <div class="subtaxons row row-cols-2 g-3 mb-5 row-cols-sm-3 d-md-none">
  51.                         {% for child in taxonChildren %}
  52.                             {% if child.enabled %}
  53.                                 <div class="subtaxons-item col">
  54.                                     <a class="subtaxons-link d-flex align-items-center h-100 p-3 border rounded link-no-decoration cfs-7 lh-1 fw-normal" href="{{ path('sylius_shop_product_index', {'slug': child.redirect ?: child.slug, '_locale': child.translation.locale}) }}">{{ child.name }}</a>
  55.                                 </div>
  56.                             {% endif %}
  57.                         {% endfor %}
  58.                     </div>
  59.                 {% endif %}
  61.                 {% include '@SyliusShop/Product/Index/_main.html.twig' with { 'taxon': taxon } %}
  62.             </div>
  63.         </div>
  64.     {% elseif taxon.parent and taxon.parent.isRoot() %}
  65.         <div class="catalog catalog-taxon">
  66.             {#{{ dump(taxon) }}#}
  67.             <div class="taxon mb-4">
  68.                 <h1 class="custom-display-4 text-center">{{ taxon.name }}</h1>
  69.                 {% if taxon.description is not empty %}
  70.                     <div class="description">
  71.                         {{ taxon.description|raw }}
  72.                     </div>
  73.                 {% endif %}
  74.             </div>
  76.             {% for taxonItem in menuTaxons %}
  77.                 {#{{ dump(taxonItem) }}#}
  78.                 {% set taxonItemImage = taxonItem.imagesByType('catalog') is not empty %}
  79.                 <div class="taxon-item row py-4{% if not loop.first %} mt-6{% endif%}{% if loop.index is odd %} bg-light{% endif %}">
  80.                     {% if taxonItem.imagesByType('catalog') is not empty %}
  81.                         <div class="taxon-item-img-wrap d-none d-lg-block col-lg-6 col-xxxxl-5 col-xxxxxl-4 ps-lg-4">
  82.                             <a href="{{ path('sylius_shop_product_index', {'slug': taxonItem.redirect ?: taxonItem.slug, '_locale': taxonItem.translation.locale}) }}">
  83.                                 {#<picture>#}
  84.                                 {#    <source srcset="{{ taxonItem.imagesByType('catalog').first.path|imagine_filter('app_shop_taxon_catalog_desktop') }}" media="(min-width: 992px)">#}
  85.                                 {#    <source srcset="{{ taxonItem.imagesByType('catalog').first.path|imagine_filter('app_shop_taxon_catalog_mobile') }}">#}
  86.                                 {#    <img class="taxon-item-img" src="{{ taxonItem.imagesByType('catalog').first.path|imagine_filter('app_shop_original') }}" alt="{{ taxonItem.name }}">#}
  87.                                 {#</picture>#}
  88.                                 <img class="taxon-item-img lazy" src="{{ taxonItem.imagesByType('catalog').first.path|imagine_filter('app_shop_taxon_catalog_desktop_small') }}" data-src="{{ taxonItem.imagesByType('catalog').first.path|imagine_filter('app_shop_taxon_catalog_desktop') }}" alt="{{ taxonItem.name }}">
  89.                             </a>
  90.                         </div>
  91.                     {% endif %}
  92.                     <div class="taxon-item-text d-flex flex-column justify-content-center col-lg-6 col-xxxxl-7 col-xxxxxl-8{% if loop.index is odd %} order-lg-first{% endif %}">
  93.                         <div class="taxon-item-text-content{# p-4#}">
  94.                             <h2 class="taxon-item-title custom-display-7 mb-0 text-center d-flex flex-column justify-content-center text-lg-start"
  95.                                 onclick="window.location.href='{{ path('sylius_shop_product_index', {'slug': taxonItem.redirect ?: taxonItem.slug, '_locale': taxonItem.translation.locale}) }}'"
  96.                                 {% if taxonItemImage %}style="background-image: url({{ taxonItem.imagesByType('catalog').first.path|imagine_filter('app_shop_taxon_catalog_mobile') }});"{% endif %}
  97.                             >
  98.                                 <span class="taxon-item-title-text">{{ taxonItem.name }}</span>
  99.                             </h2>
  100.                             {% if taxonItem.description is not empty %}
  101.                                 <div class="description fw-normal mt-3">{{ taxonItem.description|raw }}</div>
  102.                             {% endif %}
  104.                             {{ render(url('app_shop_products_by_label_code_and_taxon_slug', {
  105.                                 'labelCode': 'top',
  106.                                 'taxonSlug': taxonItem.redirect ?: taxonItem.slug,
  107.                                 'count': 20,
  108.                                 'template': '@SyliusShop/Product/Box/_top_products_slider.html.twig',
  109.                                 'taxonName': taxonItem.name,
  110.                                 'taxonCode': taxonItem.code
  111.                             })) }}
  112.                         </div>
  113.                     </div>
  117.                     {#<div class="link">#}
  118.                     {#    <a href="{{ path('sylius_shop_product_index', {'slug': taxonItem.slug, '_locale': taxonItem.translation.locale})  }}">{{ 'app.ui.taxon.view' | trans }}</a>#}
  119.                     {#</div>#}
  121.                     {#                    <div class="col-12 mt-4 text-end">#}
  122.                     {#                        <a class="btn btn-lg btn-outline-primary d-inline-flex align-items-center" href="{{ path('sylius_shop_product_index', {'slug': taxonItem.slug, '_locale': taxonItem.translation.locale}) }}">{{ 'app.ui.taxon.view'|trans }}<svg class="icon icon-xl bi-arrow-right-short  ms-2" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true"><path fill-rule="evenodd" d="M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8z"/></svg></a>#}
  123.                     {#                    </div>#}
  124.                 </div>
  126.             {% endfor %}
  127.         </div>
  128.     {% endif %}
  129. {% endblock %}