templates/ECommerce/App/Product/large_icons.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% trans_default_domain 'ECommerceBundle' %}
  5. {%- import 'ECommerce/App/Product/macros.html.twig' as macros -%}
  7. {% block body %}
  8. <div class="container-fluid">
  9. <div class="row">
  10. <div class="container">
  11. <div class="content">
  12. <div class="container">
  13. <div class="row position-relative">
  15. <div class="col product-index-col pr-0">
  16. <div class="row p-0 blog-post-content align-items-start">
  18. <div class="p-0 product-index-table border-left-2 w-100">
  19. <div class="row p-0 pl-5 position-relative">
  20. <img src="{{ asset('assets/static/shop-hero.png') }}" class="img-fluid w-100" alt="Shop Hero" />
  22. <div class="shop-hero-captions">
  23. <h1>{{ 'product.shop-hero-title'|trans }}</h1>
  24. </div>
  25. </div>
  26. <div class="row table-headline p-0 pl-3 pb-5">
  27. {{ form_start(form) }}
  29. <div class="col-2 p-0 sidebar-part">
  30. <button class="sidebar-toggler" type="button" data-toggle="collapse" data-target="#sidebar-part" aria-controls="sidebar-part" aria-expanded="false" aria-label="Toggle sidebar part">
  31. <span class="sidebar-toggler-icon"></span>{{ 'product.filters'|trans }}
  32. </button>
  33. <div class="row p-0 pr-3 collapse sidebar-collapse" id="sidebar-part">
  34. <h3 class="font-24 line-height-113 font-weight-bold pt-53 mb-4 w-100 border-bottom-2-black pb-4 text-uppercase">{{ 'categories'|trans }}</h3>
  35. <h4 class="accordion-header active font-21 line-height-113 font-weight-bold w-100 mb-40">{{ 'product.manufacturer'|trans }}</h4>
  36. {{ form_widget(form.manufacturers, {attr: {class: 'accordion-content max-vh-15 mb-5 w-100'}}) }}
  38. <h4 class="accordion-header active font-21 line-height-113 font-weight-bold w-100 mb-40">{{ 'product.price_range'|trans }}</h4>
  39. <div class="accordion-content range-slider">
  40. <div class="sliders">
  41. </div>
  43. <div class="manual-input-values">
  44. <span class="font-21 line-height-113">
  45. {{ form_widget(form.min) }} {{ currency_code(app.user) }}
  46. </span>
  47. <span class="font-21 line-height-113">
  48. {{ form_widget(form.max,
  49. {attr:
  50. {
  51. max: global_max_product_price(app.user)|number_format(0, '.', ''),
  52. }
  53. })
  54. }} {{ currency_code(app.user) }}
  55. </span>
  56. </div>
  58. </div>
  60. <h4 class="accordion-header active font-21 line-height-113 font-weight-bold w-100 mb-40">{{ 'product.categories'|trans }}</h4>
  61. {{ form_widget(form.categories, {attr: {class: 'accordion-content max-vh-15 mb-5 w-100'}}) }}
  63. <h4 class="accordion-header active font-21 line-height-113 font-weight-bold w-100 mb-40">{{ 'product.sub_categories'|trans }}</h4>
  64. {{ form_widget(form.subCategories, {attr: {class: 'accordion-content max-vh-15 mb-5 w-100'}}) }}
  65. </div>
  66. </div>
  67. <div class="form-inline flex-nowrap">
  68. {{ form_widget(form.sortBy) }}
  70. {% set largeIconView = 'assets/static/large-icon-view.svg' %}
  71. {% set listView = 'assets/static/list-view-selected.svg' %}
  72. {% if app.request.query.get('view') == 'large-icons' %}
  73. {% set largeIconView = 'assets/static/large-icon-view-selected.svg' %}
  74. {% set listView = 'assets/static/list-view.svg' %}
  75. {% endif %}
  77. <a class="list-view text-decoration-none"
  78. href="{{ path(app.request.attributes.get('_route'), app.request.query.all | merge({'view': 'list'})) }}">
  79. <img src="{{ asset(listView) }}" alt="List View">
  80. </a>
  81. <a class="large-icon-view text-decoration-none ml-2"
  82. href="{{ path(app.request.attributes.get('_route'), app.request.query.all | merge({'view': 'large-icons'})) }}">
  83. <img src="{{ asset(largeIconView) }}" alt="Large Icon View">
  84. </a>
  85. </div>
  87. {{ form_end(form) }}
  88. </div>
  90. {% include 'ECommerce/App/Product/large_icons.ajax.twig' %}
  92. <div class="navigation d-flex justify-content-end ml-auto product-index-navigation">
  93. <div class="row pl-0 pr-0">
  94. <div class="col-12 ">
  95. {{ knp_pagination_render(products) }}
  96. </div>
  97. </div>
  98. </div>
  99. </div>
  100. </div>
  103. </div>
  105. <div class="row justify-content-center w-100">
  106. <div class="synonym-products">
  107. <div id="interchange-wrapper" class="mt-3 mb-5">
  108. <div class="row justify-content-center">
  109. <div class="col-12 mb-5 text-center">
  110. <h1>{{ 'general.interchange_button_title'|trans }}</h1>
  111. <a class="btn btn-primary mt-4"
  112. href="{{ path('mdl_app_synonym_product_find', { 'title': ('*'|trim('*', 'left')) }) }}"
  113. data-intro="{{ ('intro.interchange'|trans) }}"
  114. data-toggle="replace"
  115. data-trigger="#interchange-wrapper">
  116. <span class="text-capitalize font-21 font-weight-normal">{{ 'general.interchange_button_search'|trans }}</span>
  117. <img src="{{ asset('assets/static/arrows-both-way.svg') }}" class="img-fluid ml-5"
  118. alt="found in interchange catalogue">
  119. </a>
  120. </div>
  121. </div>
  122. </div>
  123. </div>
  124. </div>
  126. </div>
  127. </div>
  128. </div>
  129. </div>
  130. </div>
  131. </div>
  132. {% endblock %}
  134. {% block javascripts %}
  135. {{ parent() }}
  136. {{ encore_entry_script_tags('app/twoInputSlider') }}
  137. {{ encore_entry_script_tags('app/submitFormOnChange') }}
  138. {{ encore_entry_script_tags('app/showHideToggle') }}
  139. {% endblock %}