src/PortalBundle/Resources/views/Main/new-index.html.twig line 1

Open in your IDE?
  1. {% extends '@Portal/template.html.twig' %}
  3. {% block head %}
  4.     <title>{{ 'seo.main.title'|trans({}, 'portal_base') }}</title>
  5.     <meta name="description" content="{{ 'seo.main.description'|trans({}, 'portal_base') }}">
  6.     <link rel="stylesheet" type="text/css" href="/dist/{{ MODE }}/portal/css/portalMain.css?{{ VERSION }}">
  7. {% endblock head %}
  9. {% block ogtagDynamic %}
  10.     <meta property="og:title" content="{{ 'seo.main.title'|trans({}, 'portal_base') }}">
  11.     <meta property="og:description" content="{{ 'seo.main.description'|trans({}, 'portal_base') }}"/>
  12. {% endblock ogtagDynamic %}
  14. {% block content %}
  15.     <section class="section__header__title">
  16.         <div class="container">
  17.             <h1 class="header__title">{{ 'new_front_page.internet_car_salon'|trans({}, 'portal_base') }} VIDI.UA</h1>
  18.             <p class="header__sub-title">{{ 'base.home.title_desc'|trans({}, 'portal_base') }}</p>
  19.         </div>
  20.     </section>
  22.     {% include '@Portal/Modules/vehicle-filter.html.twig' %}
  24.     <section class="section__indented">
  25.         <div class="container">
  26.             <div class="service__selection__wrapper">
  28.                 <a id="main_tradein" class="service__selection__box" href="{{ path('portal_finance_tradein') }}">
  29.                     <p class="service__selection__title">{{ 'base.home.selection.trade_in_alt'|trans({}, 'portal_base') }}</p>
  30.                     <span class="service__selection__sub-title">{{ 'base.home.selection.redemption_exchange'|trans({}, 'portal_base') }}</span>
  31.                     <img class="service__selection__img" src="{{ asset('bundles/portal/img/home-page/service-img-1.png') }}" alt="">
  32.                 </a>
  34.                 <a id="main_kredit" class="service__selection__box" href="{{ path('portal_finance_credit') }}">
  35.                     <p class="service__selection__title">{{ 'base.home.selection.credit_leasing'|trans({}, 'portal_base') }}</p>
  36.                     <img class="service__selection__img" src="{{ asset('bundles/portal/img/home-page/service-img-2.png') }}" alt="">
  37.                 </a>
  39.                 <a id="main_kasko" class="service__selection__box" href="{{ path('portal_finance_insurance') }}">
  40.                     <p class="service__selection__title">{{ 'base.home.selection.insurance'|trans({}, 'portal_base') }}</p>
  41.                     <img class="service__selection__img" src="{{ asset('bundles/portal/img/home-page/service-img-3.png') }}" alt="">
  42.                 </a>
  44.                 <a id="main_sto" class="service__selection__box" href="{{ path('portal_service') }}">
  45.                     <p class="service__selection__title">{{ 'base.home.selection.car_diagnostics'|trans({}, 'portal_base') }} VIDI</p>
  46.                     <span class="service__selection__sub-title">{{ 'base.home.selection.online_registration'|trans({}, 'portal_base') }} </span>
  47.                     <img class="service__selection__img" src="{{ asset('bundles/portal/img/home-page/service-img-4.png') }}" alt="">
  48.                 </a>
  50.                 <a id="main_unicomers" class="service__selection__box" href="{{ path('portal_unicomers') }}">
  51.                     <p class="service__selection__title">{{ 'base.home.selection.conversion'|trans({}, 'portal_base') }}</p>
  52.                     <img class="service__selection__img" src="{{ asset('bundles/portal/img/home-page/service-img-5.png') }}" alt="">
  53.                 </a>
  55.                 <a id="main_corporate" class="service__selection__box" href="{{ path('portal_finance_corporate') }}">
  56.                     <p class="service__selection__title">{{ 'base.home.selection.car_business'|trans({}, 'portal_base') }}</p>
  57.                     <img class="service__selection__img" src="{{ asset('bundles/portal/img/home-page/service-img-6.png') }}" alt="">
  58.                 </a>
  59.             </div>
  60.         </div>
  61.     </section>
  63.     {% if slides|length %}
  64.     <section class="section__indented">
  65.         <div class="container">
  66.             <div class="swiper mySwiper">
  67.                 <div class="swiper-wrapper slider-home">
  68.                     {% for slide in slides %}
  69.                         <a class="swiper-slide slider__home-img-link" href="{{ slide['url'] }}">
  70.                             <picture class="lazy slider__home-img"
  71.                                 data-webp="{{ slide.image_mobile_webp }}" data-fallback="{{ slide.image_mobile }}"
  72.                                 data-desktop-webp="{{ slide.image_webp }}" data-desktop-fallback="{{ slide.image }}"
  73.                                 alt="{{ slide.title }}"></picture>
  74.                         </a>
  75.                     {% endfor %}
  76.                 </div>
  78.                 <div class="swiper-button-next">
  79.                     <img src="{{ asset('bundles/portal/img/home-page/slider-arrow-right.svg') }}" width="40" height="40">
  80.                 </div>
  81.                 <div class="swiper-button-prev">
  82.                     <img src="{{ asset('bundles/portal/img/home-page/slider-arrow-left.svg') }}" width="40" height="40">
  83.                 </div>
  84.                 <div class="swiper-pagination"></div>
  85.             </div>
  86.         </div>
  87.     </section>
  88.     {% endif %}
  90.     <section class="section__indented">
  91.         <div class="container">
  92.             <div class="main__title__wrapper">
  93.                 <p class="main__title">{{ 'base.home.transport_destination'|trans({}, 'portal_base') }}</p>
  94.                 <label class="load-more-btn" for="load-more">
  95.                     <span class="unloaded main__title-more">{{ 'base.home.show_all_selections'|trans({}, 'portal_base') }}</span>
  96.                 </label>
  97.             </div>
  99.             <div class="load-more-container recomendation__item__wrapper">
  100.                 <input type="checkbox" id="load-more"/>
  101.                 {% for recommend in recommendGroup %}
  102.                     <div class="recomendation__item__box">
  103.                         <a href="{{ path('portal_new_catalog_groups', {'state':'new', 'type':'car', 'group': recommend.url}) }}">
  104.                             <img class="recomendation__item-img" src="{{ sonata_path(recommend.image, 'reference') }}" alt="">
  105.                             <div class="recomendation__item-info">
  106.                                 <p class="recomendation__item__title">{{ recommend.title(app.request.locale) }}</p>
  107.                                 <p class="recomendation__item__more">{{ 'base.home.look'|trans({}, 'portal_base') }}</p>
  108.                             </div>
  109.                         </a>
  110.                     </div>
  111.                 {% endfor %}
  112.             </div>
  113.         </div>
  114.     </section>
  116.     {# !!! Тимчасово скритий блок !!! #}
  117.     <section style="display: none;" class="section__indented">
  118.         <div class="container">
  119.             <div class="main__title__wrapper">
  120.                 <p class="main__title">Найчастіше шукають</p>
  121.                 <label class="load-more-btn" for="load-more-2">
  122.                     <span class="unloaded-2 main__title-more">{{ 'base.home.show_all_selections'|trans({}, 'portal_base') }}</span>
  123.                 </label>
  124.             </div>
  126.             <div class="load-more-container recomendation__item__wrapper">
  127.                 <input type="checkbox" id="load-more-2"/>
  129.                     <div class="recomendation__item__box">
  130.                         <a href="#">
  131.                             <img class="recomendation__item-img" src="https://vidi.ua/uploads/media/dc_site/0004/05/da399627c465b6ea6e30261c95cbaf2e1a6e3d61.png" alt="">
  132.                             <div class="recomendation__item-info">
  133.                                 <p class="recomendation__item__title">Name</p>
  134.                                 <p class="recomendation__item__more">{{ 'base.home.look'|trans({}, 'portal_base') }}</p>
  135.                             </div>
  136.                         </a>
  137.                     </div>
  138.                     <div class="recomendation__item__box">
  139.                         <a href="#">
  140.                             <img class="recomendation__item-img" src="https://vidi.ua/uploads/media/dc_site/0004/05/da399627c465b6ea6e30261c95cbaf2e1a6e3d61.png" alt="">
  141.                             <div class="recomendation__item-info">
  142.                                 <p class="recomendation__item__title">Name</p>
  143.                                 <p class="recomendation__item__more">{{ 'base.home.look'|trans({}, 'portal_base') }}</p>
  144.                             </div>
  145.                         </a>
  146.                     </div>
  147.                     <div class="recomendation__item__box">
  148.                         <a href="#">
  149.                             <img class="recomendation__item-img" src="https://vidi.ua/uploads/media/dc_site/0004/05/da399627c465b6ea6e30261c95cbaf2e1a6e3d61.png" alt="">
  150.                             <div class="recomendation__item-info">
  151.                                 <p class="recomendation__item__title">Name</p>
  152.                                 <p class="recomendation__item__more">{{ 'base.home.look'|trans({}, 'portal_base') }}</p>
  153.                             </div>
  154.                         </a>
  155.                     </div>
  156.                     <div class="recomendation__item__box">
  157.                         <a href="#">
  158.                             <img class="recomendation__item-img" src="https://vidi.ua/uploads/media/dc_site/0004/05/da399627c465b6ea6e30261c95cbaf2e1a6e3d61.png" alt="">
  159.                             <div class="recomendation__item-info">
  160.                                 <p class="recomendation__item__title">Name</p>
  161.                                 <p class="recomendation__item__more">{{ 'base.home.look'|trans({}, 'portal_base') }}</p>
  162.                             </div>
  163.                         </a>
  164.                     </div>
  165.                     <div class="recomendation__item__box">
  166.                         <a href="#">
  167.                             <img class="recomendation__item-img" src="https://vidi.ua/uploads/media/dc_site/0004/05/da399627c465b6ea6e30261c95cbaf2e1a6e3d61.png" alt="">
  168.                             <div class="recomendation__item-info">
  169.                                 <p class="recomendation__item__title">Name</p>
  170.                                 <p class="recomendation__item__more">{{ 'base.home.look'|trans({}, 'portal_base') }}</p>
  171.                             </div>
  172.                         </a>
  173.                     </div>
  174.                     <div class="recomendation__item__box">
  175.                         <a href="#">
  176.                             <img class="recomendation__item-img" src="https://vidi.ua/uploads/media/dc_site/0004/05/da399627c465b6ea6e30261c95cbaf2e1a6e3d61.png" alt="">
  177.                             <div class="recomendation__item-info">
  178.                                 <p class="recomendation__item__title">Name</p>
  179.                                 <p class="recomendation__item__more">{{ 'base.home.look'|trans({}, 'portal_base') }}</p>
  180.                             </div>
  181.                         </a>
  182.                     </div>
  183.                     <div class="recomendation__item__box">
  184.                         <a href="#">
  185.                             <img class="recomendation__item-img" src="https://vidi.ua/uploads/media/dc_site/0004/05/da399627c465b6ea6e30261c95cbaf2e1a6e3d61.png" alt="">
  186.                             <div class="recomendation__item-info">
  187.                                 <p class="recomendation__item__title">Name</p>
  188.                                 <p class="recomendation__item__more">{{ 'base.home.look'|trans({}, 'portal_base') }}</p>
  189.                             </div>
  190.                         </a>
  191.                     </div>
  192.                     <div class="recomendation__item__box">
  193.                         <a href="#">
  194.                             <img class="recomendation__item-img" src="https://vidi.ua/uploads/media/dc_site/0004/05/da399627c465b6ea6e30261c95cbaf2e1a6e3d61.png" alt="">
  195.                             <div class="recomendation__item-info">
  196.                                 <p class="recomendation__item__title">Name</p>
  197.                                 <p class="recomendation__item__more">{{ 'base.home.look'|trans({}, 'portal_base') }}</p>
  198.                             </div>
  199.                         </a>
  200.                     </div>
  201.                     <div class="recomendation__item__box">
  202.                         <a href="#">
  203.                             <img class="recomendation__item-img" src="https://vidi.ua/uploads/media/dc_site/0004/05/da399627c465b6ea6e30261c95cbaf2e1a6e3d61.png" alt="">
  204.                             <div class="recomendation__item-info">
  205.                                 <p class="recomendation__item__title">Name</p>
  206.                                 <p class="recomendation__item__more">{{ 'base.home.look'|trans({}, 'portal_base') }}</p>
  207.                             </div>
  208.                         </a>
  209.                     </div>
  210.                     <div class="recomendation__item__box">
  211.                         <a href="#">
  212.                             <img class="recomendation__item-img" src="https://vidi.ua/uploads/media/dc_site/0004/05/da399627c465b6ea6e30261c95cbaf2e1a6e3d61.png" alt="">
  213.                             <div class="recomendation__item-info">
  214.                                 <p class="recomendation__item__title">Name</p>
  215.                                 <p class="recomendation__item__more">{{ 'base.home.look'|trans({}, 'portal_base') }}</p>
  216.                             </div>
  217.                         </a>
  218.                     </div>
  220.             </div>
  221.         </div>
  222.     </section>
  224.     <section class="section__indented mobile-mt">
  225.         <div class="container">
  227.             <div class="main__title__wrapper main__title__wrapper__show__bob">
  228.                 <p class="main__title">{{ 'cars.new.buy'|trans({}, 'portal_base') }}</p>
  229.                 <a class="main__title-more main__title-more-show-mob"
  230.                    href="{{ path('portal_new_catalog', { 'state': 'new', 'type': 'car' }) }}">{{ 'base.home.show_all_new_cars'|trans({}, 'portal_base') }}</a>
  231.             </div>
  233.             <div class="brand__choice__wrapepr">
  234.                 {% for brand in brands %}
  235.                     <a class="brand__choice__box" href="{{ brand.url }}">
  236.                         <div class="brand__choice__img" style="background-image: url({{ brand.image }})"></div>
  237.                         <p class="brand__choice__name">{{ brand.name }}</p>
  238.                         <span class="brand__choice__counter">{{ brand.count }}</span>
  239.                     </a>
  240.                 {% endfor %}
  241.             </div>
  242.         </div>
  243.     </section>
  244. {% endblock content %}
  246. {% block script %}
  247.     <script src="/dist/{{ MODE }}/portal/js/portalMain.js?{{ VERSION }}"></script>
  248.     <script>
  249.         $(() => {
  250.             portal.portalMain.initSlider();
  251.             portal.portalMain.initVehicleFilter({
  252.                 initChangeFilterUrl: '{{ path('portal_vehicle_filter_change') }}',
  253.                 initVehicleFilterUrl: '{{ path('portal_vehicle_filter_inti_url') }}',
  254.                 initData: '{{ vehicleFilter|json_encode_replace|raw }}',
  255.                 selected: {
  256.                     vehicleType: 1,
  257.                     isUsed: 0
  258.                 }
  259.             });
  260.         });
  261.     </script>
  262. {% endblock script %}