src/DcSiteBundle/Resources/views/Nissan/Car/used-car-catalog.html.twig line 1

Open in your IDE?
  1. {% extends '@DcSite/Nissan/base.html.twig' %}
  3. {% block seo %}
  4.     <title>{{ 'seo.used_cars.catalog.title'|trans({}, 'dc_nissan') }}</title>
  5.     <meta name="description" content="{{ 'seo.used_cars.catalog.description'|trans({}, 'dc_nissan') }}" />
  6. {% endblock %}
  8. {% block ogtagDynamic %}
  9.     <meta property="og:title" content="{{ 'seo.used_cars.catalog.title'|trans({}, 'dc_nissan') }}"/>
  10.     <meta property="og:description" content="{{ 'seo.used_cars.catalog.description'|trans({}, 'dc_nissan') }}"/>
  11. {% endblock ogtagDynamic %}
  13. {% block css %}
  14.     <link type="text/css" media="all" href="{{ asset('/bundles/dcsite/css/nissan/secondhand-catalog.css') }}" rel="stylesheet"/>
  15.     <link type="text/css" media="all" href="{{ asset('/bundles/dcsite/css/vue-range.css') }}" rel="stylesheet"/>
  16.     <link type="text/css" media="all" href="{{ asset('/bundles/dcsite/css/nissan/used/used.css') }}" rel="stylesheet">
  17.     <link type="text/css" media="all" href="{{ asset('/bundles/dcsite/css/nissan/used/used-single.css') }}" rel="stylesheet">
  18.     <link type="text/css" media="all" href="{{ asset('/bundles/dcsite/css/nissan/used/owl.carousel.min.css') }}" rel="stylesheet">
  20. {% endblock %}
  22. {% block content %}
  24.     <section class="secondhand" id="secondhandCatalog" v-if="isInit">
  26.         <section class="title-breadcrumbs">
  27.             <div class="container">
  28.                 <div class="row">
  29.                     <div class="col-12">
  30.                         <div class="vidi_breadcrumbs" >
  31.                             <span>
  32.                                 <a href="{{ path('nissan_homepage') }}" >
  33.                                     <span>{{ 'pages.breadcrumbs.main'|trans({},'dc_nissan') }}</span>
  34.                                 </a>
  35.                             </span>
  36.                             <span class="bc_sep"> → </span>
  37.                             <span>
  38.                                 <span class="last-breadcrumbs">{{ 'used_cars_title'|trans({}, 'dc_lexus') }}</span>
  39.                             </span>
  40.                         </div>
  41.                     </div>
  42.                 </div>
  43.             </div>
  44.         </section>
  45.         <section class="section-padding pb-0">
  46.             <div class="container">
  47.                 <div class="row">
  48.                     <div class="col-12">
  49.                         <div class="row no-gutters">
  50.                             <h1 class="mb-0 pb-0 section-title">{{ 'used_cars_title'|trans({}, 'dc_lexus') }}</h1>
  51.                         </div>
  52.                     </div>
  53.                 </div>
  54.             </div>
  55.         </section>
  57.         <!--  Section Filter  -->
  58.         <div class="container--box-shadow" style="display: none;">
  59.             <div class="container">
  60.                 <div class="row">
  61.                     <div class="col-md-12">
  62.                         <div class="navbar-filter">
  63.                             <ul class="navbar-filter__list d-flex align-items-center justify-content-between pl-0 mb-0">
  64.                                 <li class="navbar-filter__item d-flex">
  65.                                     <h3 class="navbar-filter__item--header">Фільтр</h3>
  66.                                     <span class="ml-2 position-relative pt-1"><img src="{{ asset('bundles/dcsite/img/mazda/used/icons/sliders.png') }}" alt="sliders"></span>
  67.                                 </li>
  68.                                 <li class="nav-item nav-item-model dropdown">
  69.                                     <a class="nav-link dropdown-toggle" href="#" id="model" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
  70.                                         Модель
  71.                                     </a>
  72.                                     <p class="navbar-filter__selected">Mazda 6</p>
  73.                                     <div class="dropdown-menu" aria-labelledby="model">
  74.                                         <p class="dropdown-header">Виберіть модель</p>
  75.                                         <div class="dropdown-divider"></div>
  76.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  77.                                             <label for="radio-model1" class="form-check-label">Mazda 6</label>
  78.                                             <input type="radio" id="radio-model1" name="radio-model" value="Mazda 6" class="form-check-input position-static ml-5" checked>
  79.                                         </div>
  80.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  81.                                             <label for="radio-model2" class="form-check-label">Mazda CX-3</label>
  82.                                             <input type="radio" id="radio-model2" name="radio-model" value="Mazda CX-3" class="form-check-input position-static ml-5" >
  83.                                         </div>
  84.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  85.                                             <label for="radio-model3" class="form-check-label">Mazda CX-30</label>
  86.                                             <input type="radio" id="radio-model3" name="radio-model" value="Mazda CX-30" class="form-check-input position-static ml-5" >
  87.                                         </div>
  88.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  89.                                             <label for="radio-model4" class="form-check-label">Mazda CX-5</label>
  90.                                             <input type="radio" id="radio-model4" name="radio-model" value="Mazda CX-5" class="form-check-input position-static ml-5" >
  91.                                         </div>
  92.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  93.                                             <label for="radio-model5" class="form-check-label">Mazda CX-9</label>
  94.                                             <input type="radio" id="radio-model5" name="radio-model" value="Mazda CX-9" class="form-check-input position-static ml-5" >
  95.                                         </div>
  96.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  97.                                             <label for="radio-model6" class="form-check-label">Mazda MX-5</label>
  98.                                             <input type="radio" id="radio-model6" name="radio-model" value="Mazda MX-5" class="form-check-input position-static ml-5" >
  99.                                         </div>
  100.                                     </div>
  101.                                 </li>
  102.                                 <li class="nav-item nav-item-fuel dropdown">
  103.                                     <a class="nav-link dropdown-toggle" href="#" id="fuel" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
  104.                                         Тип палива
  105.                                     </a>
  106.                                     <p class="navbar-filter__selected">Бензин</p>
  107.                                     <div class="dropdown-menu" aria-labelledby="fuel">
  108.                                         <p class="dropdown-header">Виберіть тип палива</p>
  109.                                         <div class="dropdown-divider"></div>
  110.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  111.                                             <label for="radio-fuel1" class="form-check-label">Бензин</label>
  112.                                             <input type="radio" id="radio-fuel1" name="radio-fuel" value="Бензин" class="form-check-input position-static ml-5" checked>
  113.                                         </div>
  114.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  115.                                             <label for="radio-fuel2" class="form-check-label">Дизель</label>
  116.                                             <input type="radio" id="radio-fuel2" name="radio-fuel" value="Дизель" class="form-check-input position-static ml-5">
  117.                                         </div>
  118.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  119.                                             <label for="radio-fuel3" class="form-check-label">Газ</label>
  120.                                             <input type="radio" id="radio-fuel3" name="radio-fuel" value="Газ" class="form-check-input position-static ml-5">
  121.                                         </div>
  122.                                     </div>
  123.                                 </li>
  124.                                 <li class="nav-item nav-item-drive dropdown">
  125.                                     <a class="nav-link dropdown-toggle" href="#" id="drive" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
  126.                                         Тип приводу
  127.                                     </a>
  128.                                     <p class="navbar-filter__selected">Передній</p>
  129.                                     <div class="dropdown-menu" aria-labelledby="drive">
  130.                                         <p class="dropdown-header">Виберіть тип приводу</p>
  131.                                         <div class="dropdown-divider"></div>
  132.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  133.                                             <label for="radio-drive1" class="form-check-label">Передній</label>
  134.                                             <input type="radio" id="radio-drive1" name="radio-drive" value="Передній" class="form-check-input position-static ml-5" checked>
  135.                                         </div>
  136.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  137.                                             <label for="radio-drive2" class="form-check-label">Задній</label>
  138.                                             <input type="radio" id="radio-drive2" name="radio-drive" value="Задній" class="form-check-input position-static ml-5">
  139.                                         </div>
  140.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  141.                                             <label for="radio-drive3" class="form-check-label">Повний</label>
  142.                                             <input type="radio" id="radio-drive3" name="radio-drive" value="Повний" class="form-check-input position-static ml-5">
  143.                                         </div>
  144.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  145.                                             <label for="radio-drive4" class="form-check-label">AWD</label>
  146.                                             <input type="radio" id="radio-drive4" name="radio-drive" value="AWD" class="form-check-input position-static ml-5">
  147.                                         </div>
  148.                                     </div>
  149.                                 </li>
  150.                                 <li class="nav-item nav-item-transmission dropdown">
  151.                                     <a class="nav-link dropdown-toggle" href="#" id="transmission" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
  152.                                         Тип КПП
  153.                                     </a>
  154.                                     <p class="navbar-filter__selected">Автомат</p>
  155.                                     <div class="dropdown-menu" aria-labelledby="transmission">
  156.                                         <p class="dropdown-header">Виберіть тип КПП</p>
  157.                                         <div class="dropdown-divider"></div>
  158.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  159.                                             <label for="radio-transmission1" class="form-check-label">Автомат</label>
  160.                                             <input type="radio" id="radio-transmission1" name="radio-transmission" value="Автомат" class="form-check-input position-static ml-5" checked>
  161.                                         </div>
  162.                                         <div class="form-check dropdown-item d-flex justify-content-between">
  163.                                             <label for="radio-transmission2" class="form-check-label">Механічна</label>
  164.                                             <input type="radio" id="radio-transmission2" name="radio-transmission" value="Механічна" class="form-check-input position-static ml-5">
  165.                                         </div>
  166.                                     </div>
  167.                                 </li>
  168.                                 <li class="nav-item">
  169.                                     <button class="btn btn-lg navbar-filter__button">Застосуваты</button>
  170.                                 </li>
  171.                             </ul>
  172.                         </div>
  173.                     </div>
  174.                 </div>
  175.             </div>
  176.         </div>
  177.         <!--  End section filter  -->
  181.         <!--  Car List  -->
  182.         <div class="container car-list mt-5 mb-5">
  183.             <div class="row">
  184.                 {% for dc in vehicles.secondhand %}
  185.                     {% for i,car in dc %}
  187.                     <div class="col-md-4">
  189.                         <div class="car-list__item">
  190.                             {% if car.has_nds %}
  191.                                 <div class="nds-status-car">
  192.                                     <div class="nds-car">{{ 'small_words.nds_short'|trans({},'automarket_base') }}</div>
  193.                                     <div class="nds-car-info">
  194.                                         <span>{{ 'small_words.nds'|trans({},'automarket_base') }}</span>
  195.                                         <p>{{ 'small_words.nds_full'|trans({},'automarket_base') }}</p>
  196.                                     </div>
  197.                                 </div>
  198.                             {% endif %}
  199.                             {% if car.isSelect %}
  200.                             <div class="select-status-car">
  201.                                 <div class="nds-car">
  202.                                     <svg width="39" height="44" viewBox="0 0 39 44" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
  203.                                         <circle cx="19" cy="24" r="18.5" stroke="#c3092e "/>
  204.                                         <circle cx="19" cy="24" r="10" fill="#c3092e "/>
  205.                                         <path d="M4.71068 27.4168L7.68557 27.7465L7.82637 28.4777L4.09853 27.9176L4.00481 27.4309L4.71068 27.4168ZM7.36335 26.0732L4.72268 27.4792L4.06344 27.7354L3.96881 27.2439L7.22301 25.3444L7.36335 26.0732Z" fill="#c3092e "/>
  206.                                         <path d="M8.5604 29.9255L5.34979 31.4512L5.06162 30.8448L8.27223 29.3191L8.5604 29.9255Z" fill="#c3092e "/>
  207.                                         <path d="M7.07435 34.1167L6.58406 33.5274L6.99258 33.1939L7.47974 33.7794C7.61194 33.9383 7.75783 34.0424 7.91742 34.0918C8.07826 34.14 8.2479 34.1365 8.42633 34.0812C8.60601 34.0249 8.78907 33.9192 8.9755 33.7641L9.11626 33.647C9.26015 33.5273 9.37413 33.406 9.45821 33.2831C9.5423 33.1602 9.59637 33.0369 9.62044 32.9131C9.64554 32.7906 9.64054 32.6688 9.60542 32.5477C9.5703 32.4266 9.50486 32.3085 9.40909 32.1934L8.90006 31.5815L9.30733 31.2427L9.81636 31.8545C9.96833 32.0372 10.0761 32.2291 10.1397 32.4303C10.2044 32.6327 10.2249 32.8368 10.2014 33.0427C10.1802 33.2488 10.1146 33.4473 10.0046 33.6383C9.89571 33.8306 9.74302 34.0084 9.54658 34.1719L9.40957 34.2858C9.21438 34.4482 9.01173 34.566 8.80161 34.6392C8.59378 34.7126 8.38661 34.741 8.18011 34.7243C7.97465 34.709 7.77776 34.6504 7.58946 34.5488C7.40115 34.4472 7.22945 34.3031 7.07435 34.1167ZM9.55716 31.543L6.82452 33.8164L6.39513 33.3003L9.12777 31.0269L9.55716 31.543Z" fill="#c3092e "/>
  208.                                         <path d="M12.3015 34.1559L10.2086 37.0291L9.66593 36.6338L11.7588 33.7606L12.3015 34.1559Z" fill="#c3092e "/>
  209.                                         <path d="M16.4469 38.5846C16.4611 38.5177 16.4635 38.4558 16.454 38.3989C16.4464 38.3407 16.4209 38.2845 16.3775 38.2304C16.336 38.1749 16.2727 38.1166 16.1876 38.0552C16.1044 37.9926 15.9945 37.9226 15.8578 37.8453C15.7063 37.7598 15.5672 37.6704 15.4406 37.5769C15.3141 37.4834 15.2064 37.3832 15.1177 37.2761C15.0306 37.1694 14.9692 37.0548 14.9337 36.9325C14.8985 36.8085 14.8964 36.6733 14.9276 36.5268C14.9581 36.3835 15.0161 36.2594 15.1016 36.1545C15.1887 36.0499 15.2978 35.9674 15.4288 35.9071C15.5601 35.8451 15.7071 35.8073 15.8697 35.7936C16.034 35.7803 16.2092 35.7934 16.3955 35.833C16.6534 35.8879 16.8663 35.9822 17.0342 36.1161C17.2036 36.2503 17.323 36.4088 17.3923 36.5916C17.4616 36.7744 17.4749 36.9661 17.4323 37.1667L16.778 37.0276C16.801 36.9193 16.7982 36.8189 16.7696 36.7263C16.7427 36.634 16.6881 36.5542 16.6059 36.4868C16.5253 36.4198 16.4158 36.3715 16.2773 36.3421C16.1435 36.3136 16.0279 36.3098 15.9302 36.3307C15.8342 36.3519 15.7566 36.3919 15.6975 36.4509C15.64 36.5102 15.6022 36.5821 15.5843 36.6665C15.5708 36.7301 15.5737 36.7907 15.5931 36.848C15.6129 36.9038 15.6483 36.9604 15.6993 37.0179C15.7506 37.0737 15.8168 37.1302 15.8979 37.1874C15.9808 37.2433 16.0781 37.3023 16.1897 37.3643C16.3686 37.4622 16.5222 37.5614 16.6506 37.6619C16.7806 37.7628 16.8838 37.8679 16.9604 37.9774C17.0386 38.0872 17.0897 38.2029 17.1137 38.3245C17.1394 38.4464 17.1372 38.5782 17.107 38.7199C17.0752 38.8696 17.0173 38.997 16.9334 39.1023C16.8494 39.2076 16.7437 39.29 16.6163 39.3494C16.4888 39.4088 16.3433 39.4436 16.1797 39.4538C16.0178 39.4643 15.8421 39.4494 15.6526 39.4091C15.4839 39.3732 15.3214 39.3154 15.1653 39.2356C15.0112 39.1546 14.8769 39.0545 14.7624 38.9353C14.6484 38.8145 14.5664 38.6756 14.5166 38.5186C14.4671 38.36 14.4625 38.1859 14.5028 37.9965L15.1619 38.1366C15.1385 38.2465 15.1361 38.3441 15.1545 38.4296C15.1749 38.5138 15.2125 38.5875 15.2672 38.6507C15.3239 38.7127 15.3945 38.7643 15.4789 38.8056C15.5633 38.8468 15.6573 38.8784 15.7608 38.9004C15.8945 38.9289 16.0082 38.9339 16.102 38.9156C16.1977 38.896 16.2741 38.8573 16.3313 38.7996C16.3901 38.7422 16.4286 38.6705 16.4469 38.5846Z" fill="#c3092e "/>
  210.                                         <path d="M21.2185 38.9835L21.262 39.509L19.3788 39.6649L19.3353 39.1393L21.2185 38.9835ZM19.29 36.1054L19.5832 39.6479L18.9141 39.7033L18.6209 36.1607L19.29 36.1054ZM20.8441 37.4491L20.8866 37.9624L19.2491 38.098L19.2066 37.5846L20.8441 37.4491ZM20.9615 35.967L21.0052 36.495L19.1293 36.6503L19.0856 36.1223L20.9615 35.967Z" fill="#c3092e "/>
  211.                                         <path d="M24.6274 37.9304L24.8007 38.4285L23.1128 39.0157L22.9395 38.5177L24.6274 37.9304ZM22.1361 35.5918L23.3042 38.9491L22.6701 39.1697L21.502 35.8125L22.1361 35.5918Z" fill="#c3092e "/>
  212.                                         <path d="M27.7365 36.0334L28.0273 36.4733L26.451 37.5155L26.1602 37.0756L27.7365 36.0334ZM24.6616 34.4372L26.6221 37.4024L26.0621 37.7726L24.1016 34.8075L24.6616 34.4372ZM26.6703 34.868L26.9545 35.2977L25.5839 36.2039L25.2998 35.7742L26.6703 34.868ZM26.0607 33.5121L26.3529 33.9541L24.7827 34.9922L24.4905 34.5503L26.0607 33.5121Z" fill="#c3092e "/>
  213.                                         <path d="M30.1821 32.4203L30.6121 31.9046C30.7831 32.0706 30.9028 32.2562 30.971 32.4615C31.0381 32.6657 31.0465 32.8793 30.9962 33.1023C30.9459 33.3253 30.8279 33.548 30.6424 33.7705C30.4996 33.9418 30.3409 34.0711 30.1662 34.1586C29.9913 34.2438 29.807 34.2882 29.6132 34.2919C29.4192 34.2933 29.2214 34.2534 29.0199 34.1723C28.8172 34.0901 28.6164 33.9661 28.4177 33.8004L28.2096 33.6268C28.0108 33.4611 27.8533 33.2853 27.7371 33.0994C27.6209 32.9134 27.5472 32.7248 27.516 32.5335C27.4846 32.3399 27.4956 32.1488 27.549 31.9602C27.6034 31.7704 27.7021 31.5898 27.8449 31.4186C28.0304 31.1961 28.2285 31.0424 28.4393 30.9574C28.6487 30.8714 28.8601 30.8453 29.0735 30.8792C29.2869 30.913 29.4934 30.9983 29.693 31.1351L29.263 31.6507C29.1397 31.5648 29.0213 31.5085 28.908 31.4818C28.7957 31.4538 28.686 31.462 28.5791 31.5064C28.472 31.5484 28.3647 31.6338 28.2574 31.7626C28.174 31.8626 28.1192 31.9663 28.0932 32.0739C28.0681 32.1801 28.0723 32.2895 28.1056 32.4021C28.1376 32.5136 28.1988 32.6282 28.2892 32.746C28.3784 32.8627 28.4955 32.9815 28.6405 33.1025L28.8524 33.2791C28.9911 33.3949 29.1249 33.4873 29.2536 33.5565C29.3824 33.6258 29.5047 33.6684 29.6206 33.6845C29.7364 33.7006 29.8456 33.6878 29.9482 33.6462C30.0507 33.6045 30.1452 33.5318 30.2318 33.4281C30.337 33.3018 30.4025 33.1827 30.4282 33.0705C30.4549 32.9572 30.4467 32.8476 30.4036 32.7417C30.3615 32.6346 30.2877 32.5274 30.1821 32.4203Z" fill="#c3092e "/>
  214.                                         <path d="M29.954 27.5462L33.2209 28.9473L32.9573 29.5621L29.6903 28.161L29.954 27.5462ZM30.3889 26.532L30.8758 26.7408L29.7471 29.3728L29.2602 29.164L30.3889 26.532Z" fill="#c3092e "/>
  215.                                         <path d="M6.7239 16.1745L6.88256 16.2659C7.11525 16.4 7.30679 16.5517 7.45719 16.721C7.60617 16.8895 7.71263 17.0683 7.77655 17.2573C7.84047 17.4463 7.86148 17.6396 7.83957 17.8374C7.81766 18.0352 7.75104 18.2306 7.63971 18.4238C7.53001 18.6142 7.3947 18.7692 7.23377 18.8887C7.07366 19.0069 6.89542 19.0864 6.69904 19.1272C6.50267 19.1681 6.29382 19.1671 6.07252 19.1241C5.8498 19.0803 5.62209 18.9913 5.3894 18.8573L5.23075 18.7658C4.99665 18.6309 4.80551 18.4785 4.65734 18.3086C4.50917 18.1387 4.40312 17.9593 4.3392 17.7703C4.27386 17.5805 4.25215 17.3867 4.27406 17.1889C4.29678 16.9898 4.363 16.795 4.4727 16.6046C4.58402 16.4114 4.71974 16.2557 4.87986 16.1376C5.03997 16.0195 5.21851 15.9411 5.41548 15.9024C5.61186 15.8615 5.8203 15.8633 6.04079 15.9077C6.2621 15.9507 6.4898 16.0396 6.7239 16.1745ZM6.5437 16.854L6.38082 16.7602C6.213 16.6635 6.05669 16.5941 5.91189 16.5519C5.76568 16.509 5.63139 16.4927 5.50901 16.5029C5.38664 16.5132 5.27799 16.5502 5.18308 16.6138C5.08676 16.6767 5.0065 16.7638 4.94231 16.8752C4.8773 16.988 4.84217 17.1011 4.83692 17.2146C4.83106 17.3258 4.85438 17.4369 4.90688 17.5479C4.95937 17.659 5.04044 17.7677 5.15008 17.874C5.25913 17.9782 5.39756 18.0786 5.56538 18.1753L5.72826 18.2692C5.89467 18.3651 6.05097 18.4345 6.19718 18.4774C6.34421 18.5189 6.47961 18.5349 6.6034 18.5255C6.72659 18.5138 6.83594 18.4773 6.93144 18.4158C7.02695 18.3544 7.10721 18.2673 7.17222 18.1545C7.23723 18.0416 7.27236 17.9285 7.27761 17.8151C7.28286 17.7016 7.25884 17.5901 7.20553 17.4805C7.15163 17.3687 7.06945 17.2603 6.959 17.1553C6.84854 17.0503 6.71011 16.9499 6.5437 16.854Z" fill="#c3092e "/>
  216.                                         <path d="M7.96726 12.3876L8.33943 12.7646L7.18225 13.9069L9.30724 16.0596L8.83117 16.5296L6.334 13.9998L7.96726 12.3876ZM7.59016 14.6294L8.2035 14.024C8.39926 13.8308 8.59981 13.698 8.80514 13.6256C9.00933 13.5522 9.20623 13.5373 9.39585 13.5811C9.58662 13.6238 9.75976 13.7239 9.91526 13.8815C10.0319 13.9996 10.1168 14.1285 10.17 14.2681C10.2243 14.4066 10.2464 14.5517 10.2362 14.7036C10.2249 14.8543 10.1807 15.0065 10.1038 15.1602C10.0257 15.3128 9.91305 15.4616 9.76595 15.6069L8.83117 16.5296L6.334 13.9998L6.81355 13.5264L8.94026 15.6809L9.39549 15.2316C9.49974 15.1286 9.5666 15.0238 9.59606 14.9169C9.62553 14.8101 9.62504 14.7077 9.59461 14.6096C9.56417 14.5116 9.51122 14.4244 9.43575 14.3479C9.36143 14.2726 9.27718 14.2209 9.18298 14.1926C9.08879 14.1644 8.9898 14.1661 8.88602 14.1976C8.78223 14.2292 8.67821 14.2964 8.57396 14.3993L7.96062 15.0047L7.59016 14.6294Z" fill="#c3092e "/>
  217.                                         <path d="M9.82676 10.9466L10.3419 10.6778L12.4411 12.6007L12.0627 9.78001L12.58 9.5101L13.0533 13.2726L12.6399 13.4883L9.82676 10.9466ZM9.56702 11.0821L10.0713 10.819L11.2995 12.9512L11.8066 13.9231L11.2113 14.2336L9.56702 11.0821ZM12.3333 9.63885L12.8397 9.37458L14.4841 12.5261L13.8888 12.8367L13.3817 11.8648L12.3333 9.63885Z" fill="#c3092e "/>
  218.                                         <path d="M15.1386 8.77297L16.0115 12.2188L15.3607 12.3837L14.4878 8.93784L15.1386 8.77297Z" fill="#c3092e "/>
  219.                                         <path d="M19.0814 9.79029L19.1075 10.317L17.2396 10.4093L17.2136 9.8826L19.0814 9.79029ZM17.3241 8.40807L17.4995 11.9584L16.829 11.9916L16.6535 8.44121L17.3241 8.40807ZM19.5065 8.30021L19.6819 11.8506L19.0114 11.8837L18.8359 8.33335L19.5065 8.30021Z" fill="#c3092e "/>
  220.                                         <path d="M24.4808 9.91745L22.4873 12.3961L21.8207 12.1504L24.2963 9.2744L24.7224 9.43146L24.4808 9.91745ZM24.2329 13.0395L24.3204 9.85834L24.4498 9.33098L24.8781 9.48888L24.9018 13.2861L24.2329 13.0395ZM24.6461 11.7842L24.4629 12.2813L22.6739 11.6218L22.8571 11.1247L24.6461 11.7842Z" fill="#c3092e "/>
  221.                                         <path d="M27.4758 13.1449L26.7378 12.6156L27.0099 12.2279L27.6427 12.6818C27.7512 12.7596 27.8527 12.8093 27.9473 12.8311C28.0418 12.8529 28.1285 12.8479 28.2073 12.8163C28.2873 12.7856 28.3573 12.7286 28.417 12.6453C28.4834 12.5527 28.5196 12.4645 28.5257 12.3807C28.533 12.2978 28.5092 12.2166 28.4541 12.137C28.3999 12.0561 28.316 11.9749 28.2022 11.8933L27.7539 11.5718L25.9909 14.0298L25.4453 13.6385L27.5171 10.75L28.511 11.4628C28.675 11.5804 28.8098 11.7011 28.9153 11.8249C29.0231 11.9483 29.0987 12.0746 29.1422 12.2039C29.1856 12.3332 29.1954 12.4634 29.1715 12.5945C29.1489 12.7265 29.0892 12.86 28.9925 12.9949C28.9071 13.1139 28.8006 13.2038 28.673 13.2645C28.5476 13.3248 28.4057 13.3452 28.2474 13.3258C28.0904 13.3073 27.922 13.2406 27.7421 13.1256L27.4758 13.1449ZM26.5286 14.4154L25.6537 13.7879L26.1891 13.523L26.8359 13.9869C26.9443 14.0647 27.0464 14.1108 27.1421 14.1254C27.2392 14.1409 27.3272 14.1299 27.4061 14.0924C27.4874 14.0546 27.5574 13.9946 27.6162 13.9126C27.6807 13.8227 27.7208 13.7333 27.7365 13.6444C27.7535 13.5564 27.7411 13.4704 27.6993 13.3863C27.6587 13.3032 27.5843 13.2227 27.4758 13.1449L26.9084 12.738L27.1884 12.356L27.9106 12.8739L27.9288 13.1123C28.0945 13.2332 28.2064 13.3635 28.2644 13.5032C28.3237 13.6439 28.342 13.7832 28.3192 13.9211C28.2964 14.059 28.2428 14.1868 28.1584 14.3045C28.0256 14.4896 27.8738 14.6161 27.703 14.6839C27.5335 14.7526 27.3493 14.7637 27.1504 14.7172C26.9527 14.6716 26.7455 14.571 26.5286 14.4154Z" fill="#c3092e "/>
  222.                                         <path d="M31.257 13.944L28.5744 16.2762L28.1355 15.7714L30.8181 13.4392L31.257 13.944ZM31.9811 14.7768L31.5813 15.1244L29.7023 12.9632L30.1021 12.6156L31.9811 14.7768Z" fill="#c3092e "/>
  223.                                         <path d="M32.7301 19.3701L32.5678 19.4548C32.3297 19.579 32.0988 19.659 31.8752 19.6949C31.6531 19.7301 31.4451 19.7238 31.2514 19.6762C31.0576 19.6286 30.8832 19.5424 30.7282 19.4177C30.5732 19.293 30.4441 19.1318 30.3409 18.9341C30.2393 18.7393 30.1813 18.5419 30.1669 18.3419C30.1533 18.1434 30.182 17.9504 30.253 17.7628C30.3241 17.5752 30.4371 17.3996 30.5923 17.2361C30.7489 17.0717 30.9462 16.9275 31.1843 16.8032L31.3467 16.7185C31.5862 16.5936 31.8174 16.5142 32.0403 16.4805C32.2633 16.4468 32.4716 16.4538 32.6653 16.5014C32.8605 16.5483 33.0356 16.6341 33.1906 16.7588C33.3464 16.885 33.4751 17.0455 33.5768 17.2403C33.6799 17.438 33.7383 17.6361 33.7519 17.8346C33.7655 18.0331 33.7357 18.2258 33.6625 18.4127C33.5915 18.6003 33.478 18.7751 33.3221 18.9372C33.167 19.1008 32.9696 19.2451 32.7301 19.3701ZM32.2538 18.853L32.4205 18.7661C32.5922 18.6765 32.7347 18.5819 32.848 18.4824C32.9628 18.3822 33.0487 18.2777 33.1058 18.1689C33.1629 18.0602 33.1901 17.9487 33.1874 17.8345C33.1861 17.7195 33.1557 17.605 33.0963 17.491C33.036 17.3755 32.9595 17.2851 32.8666 17.2198C32.776 17.1551 32.6697 17.115 32.5479 17.0997C32.426 17.0843 32.2908 17.0943 32.1422 17.1296C31.9957 17.1656 31.8367 17.2284 31.6649 17.318L31.4983 17.405C31.328 17.4938 31.1855 17.5884 31.0707 17.6886C30.9568 17.7903 30.8705 17.8959 30.8119 18.0054C30.7556 18.1156 30.7277 18.2274 30.7282 18.341C30.7287 18.4546 30.7591 18.5691 30.8193 18.6845C30.8795 18.7999 30.9561 18.8903 31.0489 18.9557C31.1418 19.0211 31.2488 19.0607 31.3698 19.0747C31.4931 19.0893 31.6287 19.0782 31.7766 19.0414C31.9245 19.0047 32.0835 18.9419 32.2538 18.853Z" fill="#c3092e "/>
  224.                                         <circle cx="5" cy="23" r="1" fill="#c3092e "/>
  225.                                         <circle cx="33" cy="23" r="1" fill="#c3092e "/>
  226.                                         <rect x="11" y="17.8235" width="13.1765" height="13.1765" fill="url(#pattern0)"/>
  227.                                         <circle cx="20.8824" cy="21.1176" r="3.73529" fill="#c3092e " stroke="white"/>
  228.                                         <line x1="23.9353" y1="23.3706" x2="26.9" y2="25.5941" stroke="white" stroke-linecap="round"/>
  229.                                         <path d="M19 20.1764L20.8824 22.5293L22.7647 20.1764" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
  230.                                         <defs>
  231.                                             <pattern id="pattern0" patternContentUnits="objectBoundingBox" width="1" height="1">
  232.                                                 <use xlink:href="#image0_80_309" transform="scale(0.02)"/>
  233.                                             </pattern>
  234.                                             <image id="image0_80_309" width="50" height="50" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAABmJLR0QA/wD/AP+gvaeTAAADCElEQVRoge2YTUgVURiG36PZj5Vl0EathNqYJbnIqBatalW5CyEo3LgJrAiybZt00Q9BbaKV4SJa2CJqUfQDl7AfAiFaRkb2Q5gZ3kRCnxb3kzvomHNnjnqJeeFymW++733f78ycM3NGSpEiRYoUKeLDJSkGSiXtltQkqU5SjaSNklZKqjD+tZb+UxKSRiSNSvooaVDSO0kvJL10zk0k8VMwgM3AVeAr/vAFuA7Ux/FU0BUBlknqlNQuqdTC7yU9k/RauVEekJSVNCxJzrlhq620/EpJq5S7cpsk7ZS0T1LtlIykm5JOOufG4jQ1VxMOuGuj9wfoBvZ45N9lV2TcNJ4AJb74g0LHTOAH0ORdIK+zHRgyrZb5EOgz8lbv5DO1TpjWU9/EDUY8DJR7JQ/XWwNkTbMuSk3Ue7DN/rudc7/j2YsO59yIpDt26OcOAFbYvADY5oU0mu5e0/xuq2ViwlYjzHjwV6j2W9M+4oPsuZEd9+CtUO3Tpv2wkKJmIAOMAr0Wqw8sufM+yUM8rQPGgAmg1mKPzWMGODS9oAWYJI9mi1+04+6FbiLg7YF5OG/HRwM+J4GDweQ3gZPfgDL7Tb1LXVnERm6YhwGgZNriA/AqmJwNnLhsscOB2ChwCtgCLF8A86uBrUAb8Cvg44CdvxaIZYOFfYETDRbrpfhw27w1BmJ9kr39kptIlyRVOOf2A+uV2yuUzffoF4hxSdXOuSHgkXJ7mzPOuQ+h2eSXvWJEe5jn0P0I0C+pwdMo+ka/c25HpMyQUbgHVIfkVQEd5PcQcTAOnAWqQvhrgPvTCyK3HCJWM0d+R4JGOubg3hClkahvv3N9FLgVkSdObaQPElEb6SL3xWRBYZpdSQjCkAEaZ8k/5/vWIvesyIQVJG0Eci9vPUATUI6/yd5hXOXG3WNaoQjzPNvyG73rRYBzboZv/59bFglpI8WG/6aRJUmKwyZdEiRZZGa7Ip8j1A7GFf0HYuvO1kiUPfp87OP96gJLgU5gMOR59Am4ACyN77e4dFOkSJEiRYq/A38Ad0xa7sQAAAAASUVORK5CYII="/>
  235.                                         </defs>
  236.                                     </svg>
  237.                                 </div>
  239.                             </div>
  240.                             {% endif %}
  241.                             <div class="display__image__mileage" style="width: 360px; height: 235px; background-color: grey"></div>
  242.                             <div class="owl-carousel">
  243.                                 {% for y,image_path in car.gallery %}
  244.                                     <div class="item">
  245.                                         <img src="{{ image_path.small }}" alt="" >
  246.                                     </div>
  247.                                 {% endfor %}
  248.                             </div>
  249.                             <h2 class="car-list__car--title pl-2 pr-2">{{ car.fullName }}</h2>
  250.                             <div class="car-list__price mt-4 d-flex justify-content-between pl-2 pr-2">
  251.                                 <p>
  252.                                     <span class="car-list__price--key">{{ 'used_cars.year'|trans({}, 'dc_base') }}:</span>
  253.                                     <span class="car-list__price--value"><b> {{ car.year }} </b></span>
  254.                                 </p>
  255.                                 <p>
  256.                                     <span class="car-list__price--key">{{ 'used_cars.mileage'|trans({}, 'dc_base')}}:</span>
  257.                                     <span class="car-list__price--value">{{ (car.mileage / 1000)|round() }} тис. км</span>
  258.                                 </p>
  259.                             </div>
  260.                             <hr class="mt-0">
  261.                             <div class="car-list__price d-flex justify-content-between pl-2 pr-2">
  262.                                 <p>
  263.                                     <span class="car-list__price--key">{{'used_cars.price'|trans({}, 'dc_base')}}:</span>
  264.                                     <span class="car-list__price--value"><b>₴ {{ car.price|price }}</b></span>
  265.                                 </p>
  266.                                 {% if car.creditPayment %}
  267.                                     <p>
  268.                                         <span class="car-list__price--key">{{'used_cars.credit'|trans({}, 'dc_base')}}:</span>
  269.                                         <span class="car-list__price--value">{{ car.creditPayment|price }} ₴/міс</span>
  270.                                     </p>
  271.                                 {% endif %}
  272.                             </div>
  273.                             <hr class="mt-0">
  274.                             <div class="car-list__option-block d-flex justify-content-between text-center pl-2 pr-2">
  275.                                 <div class="car-list__option-fuel">
  276.                                     <p class="mb-2"><img src="{{ asset('bundles/dcsite/img/mazda/used/icons/fuel-icon.png') }}" alt="fuel"></p>
  277.                                     <p class="car-list__option--key m-0">{{car.engine}}</p>
  279.                                     {% if num(car.engineVolume) %}
  280.                                         <p class="car-list__option--value m-0">{{ (car.engineVolume / 1000)|number_format(1) }} V</p>
  281.                                     {% endif %}
  282.                                 </div>
  283.                                 <div class="car-list__option-drive">
  284.                                     <p class="mb-2"><img src="{{ asset('bundles/dcsite/img/mazda/used/icons/drive-icon.png') }}" alt="drive"></p>
  285.                                     <p class="car-list__option--key m-0">{{car.drive}}</p>
  286.                                     <p class="car-list__option--value m-0">{{ car.enginePower }} {{'used_cars.engine_power'|trans({}, 'dc_base')}}</p>
  287.                                 </div>
  288.                                 <div class="car-list__option-transmission">
  289.                                     <p class="mb-2"><img src="{{ asset('bundles/dcsite/img/mazda/used/icons/transmission-icon.png') }}" alt="transmission"></p>
  290.                                     <p class="car-list__option--key m-0">{{car.transmission}}</p>
  291.                                     <p class="car-list__option--value m-0">{{car.body}}</p>
  292.                                 </div>
  293.                             </div>
  294.                             <div>
  295.                                 <a href="{{ car.link }}" class="btn btn-lg car-list__item--button">{{'used_cars.btn_detail'|trans({}, 'dc_base')}}</a>
  296.                             </div>
  297.                         </div>
  298.                     </div>
  299.                 {% endfor %}
  300.                 {% endfor %}
  301.             </div>
  302.         </div>
  304.     </section>
  306. {% endblock %}
  308. {% block pageJs %}
  309.     <script>
  310.         app.onCustomEvent('appInit', function () {
  311.             app.loadJs('{{ asset('/bundles/dcsite/js/secondhand.js') }}', function () {
  312.                 initSecondhand({
  313.                     initElem: '#secondhandCatalog',
  314.                     url: '{{ path('secondhand') }}',
  315.                     path: 'nissan_used_car_single',
  316.                 });
  317.             });
  318.         });
  319.     </script>
  320. {% endblock pageJs %}