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

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.     {% if taxon.isRoot() %}
  28.         <div class="catalog catalog-all">
  29.             {% include '@SyliusShop/Product/Index/_all_categories.html.twig' with { 'taxon': taxon } %}
  30.         </div>
  31.     {% elseif taxon.parent and not taxon.parent.isRoot() %}
  32.         <div class="row taxons">
  33.             <div class="d-none d-md-block col-md-4 col-lg-3 col-xl-3 col-xxl-2">
  34.                 {% include '@SyliusShop/Product/Index/_sidebar.html.twig' %}
  35.             </div>
  36.             <div class="col-12 col-md-8 col-lg-9 col-xxl-10">
  37.                 <h1 class="taxon-title">{{ taxon.name }}</h1>
  38.                 {% if taxon.description %}
  39.                     <div class="taxon-description">{{ taxon.description }}</div>
  40.                 {% endif %}
  42.                 {% set taxonChildren = taxon.children  %}
  43.                 {% if taxonChildren|length %}
  44.                     <h4 class="title d-md-none">{{ 'app.ui.taxon.subtaxons' | trans }}</h4>
  46.                     <div class="subtaxons row row-cols-2 g-3 mb-5 row-cols-sm-3 d-md-none">
  47.                         {% for child in taxonChildren %}
  48.                             {% if child.enabled %}
  49.                                 <div class="subtaxons-item col">
  50.                                     <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>
  51.                                 </div>
  52.                             {% endif %}
  53.                         {% endfor %}
  54.                     </div>
  55.                 {% endif %}
  57.                 {% include '@SyliusShop/Product/Index/_main.html.twig' with { 'taxon': taxon } %}
  58.             </div>
  59.         </div>
  60.     {% elseif taxon.parent and taxon.parent.isRoot() %}
  61.         <div class="catalog catalog-taxon">
  62.             {#{{ dump(taxon) }}#}
  63.             <div class="taxon mb-4">
  64.                 <h1 class="custom-display-4 text-center">{{ taxon.name }}</h1>
  65.                 {% if taxon.description is not empty %}
  66.                     <div class="description">
  67.                         {{ taxon.description|raw }}
  68.                     </div>
  69.                 {% endif %}
  70.             </div>
  72.             {% for taxonItem in menuTaxons %}
  73.                 {#{{ dump(taxonItem) }}#}
  74.                 {% set taxonItemImage = taxonItem.imagesByType('catalog') is not empty %}
  75.                 <div class="taxon-item row py-4{% if not loop.first %} mt-6{% endif%}{% if loop.index is odd %} bg-light{% endif %}">
  76.                     {% if taxonItem.imagesByType('catalog') is not empty %}
  77.                         <div class="taxon-item-img-wrap d-none d-lg-block col-lg-6 col-xxxxl-5 col-xxxxxl-4 ps-lg-4">
  78.                             <a href="{{ path('sylius_shop_product_index', {'slug': taxonItem.redirect ?: taxonItem.slug, '_locale': taxonItem.translation.locale}) }}">
  79.                                 {#<picture>#}
  80.                                 {#    <source srcset="{{ taxonItem.imagesByType('catalog').first.path|imagine_filter('app_shop_taxon_catalog_desktop') }}" media="(min-width: 992px)">#}
  81.                                 {#    <source srcset="{{ taxonItem.imagesByType('catalog').first.path|imagine_filter('app_shop_taxon_catalog_mobile') }}">#}
  82.                                 {#    <img class="taxon-item-img" src="{{ taxonItem.imagesByType('catalog').first.path|imagine_filter('app_shop_original') }}" alt="{{ taxonItem.name }}">#}
  83.                                 {#</picture>#}
  84.                                 <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 }}">
  85.                             </a>
  86.                         </div>
  87.                     {% endif %}
  88.                     <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 %}">
  89.                         <div class="taxon-item-text-content{# p-4#}">
  90.                             <h2 class="taxon-item-title custom-display-7 mb-0 text-center d-flex flex-column justify-content-center text-lg-start"
  91.                                 onclick="window.location.href='{{ path('sylius_shop_product_index', {'slug': taxonItem.redirect ?: taxonItem.slug, '_locale': taxonItem.translation.locale}) }}'"
  92.                                 {% if taxonItemImage %}style="background-image: url({{ taxonItem.imagesByType('catalog').first.path|imagine_filter('app_shop_taxon_catalog_mobile') }});"{% endif %}
  93.                             >
  94.                                 <span class="taxon-item-title-text">{{ taxonItem.name }}</span>
  95.                             </h2>
  96.                             {% if taxonItem.description is not empty %}
  97.                                 <div class="description fw-normal mt-3">{{ taxonItem.description|raw }}</div>
  98.                             {% endif %}
  100.                             {{ render(url('app_shop_products_by_label_code_and_taxon_slug', {
  101.                                 'labelCode': 'top',
  102.                                 'taxonSlug': taxonItem.redirect ?: taxonItem.slug,
  103.                                 'count': 20,
  104.                                 'template': '@SyliusShop/Product/Box/_top_products_slider.html.twig'
  105.                             })) }}
  106.                         </div>
  107.                     </div>
  111.                     {#<div class="link">#}
  112.                     {#    <a href="{{ path('sylius_shop_product_index', {'slug': taxonItem.slug, '_locale': taxonItem.translation.locale})  }}">{{ 'app.ui.taxon.view' | trans }}</a>#}
  113.                     {#</div>#}
  115.                     {#                    <div class="col-12 mt-4 text-end">#}
  116.                     {#                        <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>#}
  117.                     {#                    </div>#}
  118.                 </div>
  120.             {% endfor %}
  121.         </div>
  122.     {% endif %}
  123. {% endblock %}