templates/Slivki/landing-subscription/index.html.twig line 1

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html lang="ru">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1">
  6.     <meta name="google-site-verification" content="LZdJyY-ROJZoDrU1Akiha-FF7W_PmSiN4mJRSyWexog" />
  7.     <title>Landing</title>
  8.     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
  9.     <link rel="stylesheet" href="/landing/css/style.css?v={{ subscription_landing_css_version }}">
  10.     <!-- CSS only -->
  11.     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
  12.           integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
  13.     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  14.     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.css">
  15.     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  16.     <!-- JS, Popper.js, and jQuery -->
  17.     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
  18.     <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
  19.             integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
  20.             crossorigin="anonymous"></script>
  21.     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"
  22.             integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
  23.             crossorigin="anonymous"></script>
  24.     <script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery-viewport-checker/1.8.8/jquery.viewportchecker.min.js"></script>
  25.     <script src="https://cdn.jsdelivr.net/npm/jquery-menu-aim@1.1.0/jquery.menu-aim.min.js"></script>
  26.     <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js?v=1"></script>
  27.     <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
  28.     <script src="https://www.google.com/recaptcha/api.js"></script>
  29.     {% if not isMobileDevice() %}
  30.         <script src="/js/jquery.placeholder.js"></script>
  31.         <script src="/js/jquery.maskedinput.min.js"></script>
  32.         <script type="text/javascript" src="/js/jquery.cookie.min.js?v=1"></script>
  33.         <script type="text/javascript" src="/js/jquery.lazyload.js?v=1"></script>
  34.         <script src="/js/jquery.jscrollpane.min.js?v=2"></script>
  35.         <script src="/js/common.js?v={{ common_js_version }}"></script>
  36.         <script src="/js/common-old.js?v={{ common_old_js_version }}"></script>
  37.         <script src="/js/slivki_v1.js?v={{ slivki_v1_js_version }}"></script>
  38.     {% endif %}
  39.     <meta name="google-site-verification" content="33UhU8AvLA9eoT3WZfkzuOaxKNujSVAtcYZHf-pGToI" />
  40.     <!-- Global site tag (gtag.js) - Google Analytics -->
  41.     <script async src="https://www.googletagmanager.com/gtag/js?id=UA-185332166-1"></script>
  42.     <script>
  43.         window.dataLayer = window.dataLayer || [];
  45.         function gtag() {
  46.             dataLayer.push(arguments);
  47.         }
  49.         gtag('js', new Date());
  50.         gtag('config', 'UA-185332166-1');
  51.     </script>
  53.     <!-- Yandex.Metrika counter -->
  54.     <script type="text/javascript">
  55.         (function (m, e, t, r, i, k, a) {
  56.             m[i] = m[i] || function () {
  57.                 (m[i].a = m[i].a || []).push(arguments)
  58.             };
  59.             m[i].l = 1 * new Date();
  60.             k = e.createElement(t), a = e.getElementsByTagName(t)[0], k.async = 1, k.src = r, a.parentNode.insertBefore(k, a)
  61.         })
  62.         (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
  64.         ym(20933521, "init", {
  65.             clickmap: true,
  66.             trackLinks: true,
  67.             accurateTrackBounce: true,
  68.             webvisor: false
  69.         });
  70.     </script>
  71.     <noscript>
  72.         <div><img src="https://mc.yandex.ru/watch/20933521" style="position:absolute; left:-9999px;" alt=""/></div>
  73.     </noscript>
  74.     <!-- /Yandex.Metrika counter -->
  75. </head>
  76. <body style="overflow-x:hidden ">
  77. <script>
  78.     (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  79.         (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  80.         m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  81.     })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
  82.     ga('create', 'UA-185332166-1', 'auto');
  83.     ga('send', 'pageview');
  84. </script>
  85. <div class="container mb-2 py-4">
  86.     {% set tarifMinimalID = 14 %}
  87.     {% set tarifLightID = 15 %}
  88.     {% set tarifClassicID = 16 %}
  90.     <div class="row">
  91.         <div class="col-10">
  92.             <a class="logo-landing d-inline-block" href="https://www.slivki.by/">
  93.                 <img alt="" src="/landing/img/logo.svg"/>
  94.             </a>
  95.         </div>
  96.         <div class="col-2">
  97.             <div class="close-landing d-flex justify-content-end align-center cursor-pointer color-violet"
  98.                  onclick="history.back()">
  99.                 <p class="m-0">Закрыть</p>
  100.                 <p class="m-0 pl-2">X</p>
  101.             </div>
  102.         </div>
  103.     </div>
  104. </div>
  106. <div class="container">
  107.     <div class="row">
  108.         <div class="col">
  109.             <div class="button-tabs nav nav-tabs d-flex br-15 w-fit-content bg-violet-light border-none br-15 mt-4 mb-4">
  110.                 <a class="button-tab active cursor-pointer" data-id="subscriptionBtn" data-toggle="tab"
  111.                    href="#subscriptionTab">
  112.                     <p class="font-size-1000 align-self-center mb-0">Подписка</p>
  113.                 </a>
  114.                 <a class="button-tab cursor-pointer" data-id="packagesBtn" data-toggle="tab" href="#packagesTab">
  115.                     <p class="font-size-1000 align-self-center mb-0">Пакеты</p>
  116.                 </a>
  117.             </div>
  118.         </div>
  119.     </div>
  121.     <div class="tab-content">
  122.         <div id="packagesTab" class="tab-pane">
  123.             <div class="row">
  124.                 <div class="col">
  125.                     <h3 class="packages-title mb-3">Выбирайте оптимальный пакет для себя!</h3>
  126.                 </div>
  127.             </div>
  128.             <div class="row">
  129.                 <div class="col">
  130.                     <div class="packages-block p-4 br-04 mb-5">
  131.                         <div class="d-flex justify-content-between mb-3 sf-bold-font">
  132.                             <div class="pl-0">
  133.                                 <h5 class="font-size-1250 m-0 text-uppercase">Пакеты промокодов</h5>
  134.                                 <p class="color-violet">Без ежемесячных списаний</p>
  135.                             </div>
  136.                             <div>
  137.                                 <div class="d-flex color-violet text-right">
  138.                                     <span class="mr-1">⚡</span>
  139.                                     <p>Выбирайте оптимальный <br> пакет для себя!</p>
  140.                                 </div>
  141.                             </div>
  142.                         </div>
  143.                         <div class="mb-4">
  144.                             {% for batchCodesPlan in batchCodesPlans %}
  145.                                 {% if loop.index0 is divisible by (3) or loop.first %}
  146.                                     <div class="d-flex">
  147.                                 {% endif %}
  148.                                 <div class="packages-item d-flex custom-control custom-radio">
  149.                                     <input id="radioPack_{{ batchCodesPlan.getID() }}"
  150.                                            class="radio-pack form-check-input" name="radioPack" type="radio"
  151.                                            value="{{ batchCodesPlan.getID() }}"
  152.                                            data-price="{{ batchCodesPlan.getCost() }}" {{ loop.first ? ' checked' }}>
  153.                                     <label class="sf-font cursor-pointer" for="radioPack_{{ batchCodesPlan.getID() }}">
  154.                                         <div class="d-flex sf-bold-font font-size-1000 mb-1">
  155.                                             <span class="color-violet font-size-1125 mr-1">{{ batchCodesPlan.getCodesCount() }}</span>
  156.                                             <span>{{ ['промокод', 'промокода', 'промокодов']|plural(batchCodesPlan.getCodesCount()) }}</span>
  157.                                             {% if batchCodesPlan.isRecommended() %}
  158.                                                 <span class="d-flex align-items-center">
  159.                                                         <p style="font-size: 0.8rem; color: #6747E5; margin: 0 5px 0 10px;"> Рекомендуется</p>
  160.                                                         <img style="width: 1rem;" src="/images/stars.png" alt="stars">
  161.                                                     </span>
  162.                                             {% endif %}
  163.                                         </div>
  164.                                         <div class="sf-bold-font mb-1">
  165.                                             <span class="text-decoration-line-through color-red mr-1">{{ batchCodesPlan.getCostOld()|number_format(2, ',', '.') }} руб</span>
  166.                                             <span>{{ batchCodesPlan.getCost()|number_format(2, ',', '.') }} руб</span>
  167.                                         </div>
  168.                                         <p class="m-0" style="color: #C4C4C4">{{ batchCodesPlan.getDescription() }}</p>
  169.                                     </label>
  170.                                 </div>
  171.                                 {% if loop.index is divisible by (3) or loop.last %}
  172.                                     </div>
  173.                                 {% endif %}
  174.                             {% endfor %}
  175.                         </div>
  176.                         {% if batchCodesPlans|length > 0 %}
  177.                             <div class="d-flex flex-column w-100">
  178.                                 <div class="d-flex justify-content-between">
  179.                                     <div id="payBatchCodesLanding" class="button w-50 text-uppercase mr-3">Оформить
  180.                                     </div>
  181.                                 </div>
  182.                             </div>
  183.                         {% endif %}
  184.                     </div>
  185.                     <div class="packages-block-mobile">
  186.                         <h5 class="font-size-1250 m-0 text-uppercase">Пакеты промокодов</h5>
  187.                         <p class="color-violet">Без ежемесячных списаний</p>
  188.                         <div class="packages-items-mobile">
  189.                             {% for batchCodesPlan in batchCodesPlans %}
  190.                                 <a class="d-block packages-item-mobile w-100 mb-3"
  191.                                    href="{{ not app.user ? '/auth?path=' }}{{ path('profileSubscription', {'packID': batchCodesPlan.getID()}) }}">
  192.                                     <div class="position-relative br-04 b-sh-block p-3 mb-2">
  193.                                         <div class="text-black mb-3">
  194.                                             <div class="d-flex justify-content-between align-items-center mb-2">
  195.                                                 <p class="sf-bold-font m-0">
  196.                                                     <span class="font-size-2125 color-violet">{{ batchCodesPlan.getCodesCount() }}</span> {{ ['промокод', 'промокода', 'промокодов']|plural(batchCodesPlan.getCodesCount()) }}
  197.                                                 </p>
  198.                                                 {% if batchCodesPlan.isRecommended() %}
  199.                                                     <span class="d-flex align-items-center">
  200.                                                         <p class="sf-bold-font"
  201.                                                            style="font-size: 0.8rem; color: #6747E5; margin: 0 5px 0 10px;"> Рекомендуется</p>
  202.                                                         <img style="width: 1rem;" src="/images/stars.png" alt="stars">
  203.                                                     </span>
  204.                                                 {% endif %}
  205.                                             </div>
  206.                                             <p class="mb-2"
  207.                                                style="color: #C4C4C4;">{{ batchCodesPlan.getDescription() }}</p>
  208.                                             <h5 class="font-size-1125 sf-bold-font m-0 mb-4">
  209.                                                 <span class="text-decoration-line-through color-red mr-1 sf-font">{{ batchCodesPlan.getCostOld()|number_format(2, ',', '.') }} руб </span>
  210.                                                 {{ batchCodesPlan.getCost()|number_format(2, ',', '.') }} руб
  211.                                             </h5>
  212.                                         </div>
  213.                                         <div class="packages-item-mobile-btn font-size-1000 text-decoration-underline color-violet"
  214.                                              href="#">Оформить
  215.                                         </div>
  216.                                     </div>
  217.                                 </a>
  218.                             {% endfor %}
  219.                         </div>
  220.                     </div>
  221.                 </div>
  222.             </div>
  223.             <h4 class="mb-5">Пакеты промокодов без ежемесячных списаний!</h4>
  224.             <div class="packages-info-items">
  225.                 <div class="row">
  226.                     <div class="col-sm-12 col-md-4">
  227.                         <div class="packages-info-item d-flex flex-column align-items-center text-center">
  228.                             <img class="packages-info-item-img mb-2" src="/landing/img/packages-info-item-img-1.png"
  229.                                  alt="packages-info-item-img">
  230.                             <h5 class="packages-info-item-title font-size-1125 sf-bold-font mb-3">Без ежемесячных
  231.                                 списаний!</h5>
  232.                             <p class="packages-info-item-text">Вы платите только один раз. Ежемесяных списаний не
  233.                                 будет</p>
  234.                         </div>
  235.                     </div>
  236.                     <div class="col-sm-12 col-md-4">
  237.                         <div class="packages-info-item d-flex flex-column align-items-center text-center">
  238.                             <img class="packages-info-item-img mb-2" src="/landing/img/packages-info-item-img-2.png"
  239.                                  alt="packages-info-item-img">
  240.                             <h5 class="packages-info-item-title font-size-1125 sf-bold-font mb-3">Пакеты не
  241.                                 сгорают!</h5>
  242.                             <p class="packages-info-item-text">Пакеты хранятся на вашем балансе бессрочно</p>
  243.                         </div>
  244.                     </div>
  245.                     <div class="col-sm-12 col-md-4">
  246.                         <div class="packages-info-item d-flex flex-column align-items-center text-center">
  247.                             <img class="packages-info-item-img mb-2" src="/landing/img/packages-info-item-img-3.png"
  248.                                  alt="packages-info-item-img">
  249.                             <h5 class="packages-info-item-title font-size-1125 sf-bold-font mb-3">Чем больше, тем
  250.                                 выгоднее!</h5>
  251.                             <p class="packages-info-item-text">Вы сами выбираете сколько будет стоить промокод</p>
  252.                         </div>
  253.                     </div>
  254.                 </div>
  255.             </div>
  256.         </div>
  257.         <div id="subscriptionTab" class="tab-pane active">
  258.             <div class="row">
  259.                 <div class="col">
  260.                     <p class="font-size-1125 mb-3">Выберите самый выгодный<br>тарифный план!</p>
  261.                     <div class="row no-gutters mt-5 flex-mobile-landing">
  262.                         <div class="col-7">
  263.                             <p class="sf-bold-font tittle-subscription-page" style="line-height: 53px; font-size: 44px;">Экономьте еще больше <br> на покупке промокодов!</p>
  264.                         </div>
  265.                         <div class="col font-size-1125 pt-3">
  266.                             <p class="text-uppercase color-violet sf-bold-font font-size-2000">ПОДПИСКА</p>
  267.                             <h4 class="mb-4">от 22  копеек за промокод</h4>
  268.                             <ul class="pl-3">
  269.                                 <li style="color: #ffcc00;"><p class="text-black mb-2">Гибкий выбор тарифов для каждого!</p></li>
  270.                                 <li style="color: #ffcc00;"><p class="text-black mb-2">Специальные акции для подписчиков!</p></li>
  271.                                 <li style="color: #ffcc00;"><p class="color-violet mb-4">Семейный аккаунт -
  272.                                         добавляйте до 5 человек в одну оплату!</p></li>
  273.                             </ul>
  274.                         </div>
  275.                     </div>
  276.                     <div class="col m-2 p-0 mt-4 ">
  277.                         <div class="custom-control custom-checkbox">
  278.                             <input type="checkbox" class="custom-control-input" id="applyTermsOfUse" checked="checked">
  279.                             <label class="custom-control-label text-gray" for="applyTermsOfUse">Нажимая на кнопку Вы
  280.                                 принимаете <a
  281.                                         href="/polzovatelskoe-soglashenie-slivki-by" target="_blank"
  282.                                         style="color:#9c9c9c">Условия
  283.                                     подписки</a>. Подписка будет продлена автоматически.
  284.                             </label>
  285.                         </div>
  286.                     </div>
  287.                     <p class="sf-bold-font" style="line-height: 53px;font-size: 30px;margin-bottom: 0;">Тарифы на месяц</p>
  288.                 </div>
  289.             </div>
  290.             <div class="row">
  291.                 {% for subscriptionPlan in subscriptionPlanList %}
  292.                     <div class="col-lg-4  my-3">
  293.                         <div class="position-relative d-flex flex-column justify-content-between p-4 br-04 b-sh-block h-100">
  294.                             <div>
  295.                                 <div class="{{ subscriptionPlan.isRecommended ? 'd-lg-flex' : 'd-flex' }} mb-3">
  296.                                     <h5 class="text-uppercase align-self-center{{ subscriptionPlan.isRecommended ? ' mb-0' }}">{{ subscriptionPlan.name }}</h5>
  297.                                     {% if subscriptionPlan.period > 1 %}
  298.                                         <p class="sf-bold ml-2 color-violet"
  299.                                            style="font-size: 0.7rem;">{{ subscriptionPlan.trialPeriod.period != null ? subscriptionPlan.trialPeriod.period : subscriptionPlan.period }} ДН</p>
  300.                                     {% endif %}
  301.                                 </div>
  302.                                 {% if subscriptionPlan.isRecommended %}
  303.                                     <img class="stars-img" src="/landing/img/stars.png"/>
  304.                                 {% endif %}
  305.                                 {% if subscriptionPlan.getId() == 26 %}
  306.                                     <img class="bnb-img" src="/images/bnb-logo.svg"/>
  307.                                 {% endif %}
  308.                                 <h5>
  309.                                     <span class="sf-normal text-decoration-line-through color-red mr-1">{{ subscriptionPlan.oldPrice }} руб </span>
  310.                                     {{ subscriptionPlan.trialPeriod.price != null ? subscriptionPlan.trialPeriod.price : subscriptionPlan.price }} руб<span
  311.                                             class="sf-normal"> / за {{ subscriptionPlan.trialPeriod.period != null ? subscriptionPlan.trialPeriod.period : subscriptionPlan.period }} {{ ['день', 'дня', 'дней']|plural(subscriptionPlan.trialPeriod.period != null ? subscriptionPlan.trialPeriod.period : subscriptionPlan.period) }}</span>
  312.                                 </h5>
  313.                                 <p class="sf-bold font-size-1000">
  314.                                     {% if subscriptionPlan.numberOfPromoCodes > 0 and subscriptionPlan.getID() != 24 %}
  315.                                         <span class="color-violet"
  316.                                                  style="font-size: 1.4rem;">{{ subscriptionPlan.numberOfPromoCodes }}</span>
  317.                                         промокод{{ ['', 'а', 'ов']|plural(subscriptionPlan.numberOfPromoCodes) }}
  318.                                     {% else %}
  319.                                         <span class="color-violet" style="font-size: 1.4rem;">НЕОГРАНИЧЕННО</span>
  320.                                         промокодов
  321.                                     {% endif %}
  322.                                 </p>
  323.                                 {% if subscriptionPlan.getId() != tarifMinimalID and subscriptionPlan.getId() != tarifLightID %}
  324.                                     Добавляйте до {{ subscriptionPlan.getId() == tarifClassicID ? '3' : '5' }} человек в семейный аккаунт
  325.                                 {% endif %}
  326.                                     {% if subscriptionPlan.hasReclamation %}
  327.                                         <br>Без рекламы на сайте
  328.                                     {% endif %}</p>
  329.                             </div>
  330.                             <div>
  331.                                 <p style="color: #C4C4C4;">{{ subscriptionPlan.description|raw }}</p>
  332.                                 <div class="d-flex w-100">
  333.                                     <a data-id="{{ subscriptionPlan.id }}"
  334.                                        href="{{ not app.user ? '/auth?path=' }}{{ path('profileSubscription', {'show': subscriptionPlan.id}) }}"
  335.                                        style="height: 3.5rem"
  336.                                        class="button-tarif w-100 p-3 bg-violet border-0 br-04 text-white text-center">ПОДПИСАТЬСЯ</a>
  337.                                 </div>
  338.                             </div>
  339.                         </div>
  340.                     </div>
  341.                 {% endfor %}
  342.             </div>
  343.             <div class="row d-none">
  344.                 <div class="col">
  345.                     <div class="p-4 b-sh-block br-04">
  346.                         <div class="d-lg-flex">
  347.                             <div class="col pl-0">
  348.                                 <h5 class="text-uppercase">корпорация</h5>
  349.                             </div>
  350.                             <div>
  351.                                 <p class="color-violet">⚡ Система скидок для ваших сотрудников!</p>
  352.                             </div>
  353.                         </div>
  354.                         <p style="color: #C4C4C4;">для юридических лиц</p>
  356.                         <div class="d-lg-flex mx-2">
  357.                             {% for subscriptionPlan in subscriptionPlanForLegalEntitiesList %}
  358.                                 <div class="col mr-lg-5">
  359.                                     <div class="d-flex">
  360.                                         <input class="form-check-input" name="forLegalRadio" type="radio"
  361.                                                value="{{ subscriptionPlan.id }}"
  362.                                                id="defaultCheck{{ subscriptionPlan.id }}"{{ loop.first ? ' checked' }}>
  363.                                         <label class="sf-bold" for="defaultCheck{{ subscriptionPlan.id }}"><span
  364.                                                     class="sf-normal text-decoration-line-through color-red mr-1">{{ subscriptionPlan.oldPrice }} руб</span>
  365.                                             {{ subscriptionPlan.oldPrice }} руб <span
  366.                                                     class="sf-normal">/ за {{ subscriptionPlan.period > 1 ? subscriptionPlan.period }} {{ ['день', 'дня', 'дней']|plural(subscriptionPlan.period) }}</span></label>
  367.                                     </div>
  368.                                     <p class="sf-bold font-size-1000">
  369.                                         {% if subscriptionPlan.numberOfPromoCodes > 0 %}
  370.                                             <span class="color-violet"
  371.                                                      style="font-size: 1.4rem;">{{ subscriptionPlan.numberOfPromoCodes }}</span>
  372.                                             промокод{{ ['', 'а', 'ов']|plural(subscriptionPlan.numberOfPromoCodes) }}
  373.                                         {% else %}
  374.                                             <span class="color-violet" style="font-size: 1.4rem;">НЕОГРАНИЧЕННО</span>
  375.                                             промокодов
  376.                                         {% endif %}
  377.                                     </p>
  378.                                     <p style="color: #C4C4C4;">{{ subscriptionPlan.description|raw }}</p>
  379.                                 </div>
  380.                             {% endfor %}
  381.                         </div>
  382.                         <div class="d-lg-flex">
  383.                             <div class="col-lg-4 d-flex">
  384.                                 <a id="corporation" href="#"
  385.                                    class="w-100 p-3 bg-violet border-0 br-04 text-white text-center js-subscribe-for-legal-btn-landing"
  386.                                    style="height: 3.5rem">ПОДПИСАТЬСЯ</a>
  387.                             </div>
  388.                             <div class="col ml-lg-4 text-lg-left text-center mt-lg-0 mt-3">
  389.                                 <p>Форма оплаты: безналичная либо по карте<br>
  390.                                     Телефон для справок: <span class="sf-bold">+375 29 608-22-22</span>
  391.                                 </p>
  392.                             </div>
  393.                         </div>
  394.                     </div>
  395.                 </div>
  396.             </div>
  397.             <p class="sf-bold-font" style="line-height: 35px;font-size: 30px;margin-top: 20px;">Бонусы от партнеров</p>
  398.             <div class="bonuses-partner mb-4 d-flex row">
  399.                 <div class="col-md-4 col-sm-12 px-1">
  400.                     <img class="cursor-pointer" height="250" src="/images/landing/21vek_new.png">
  401.                 </div>
  402.                 <div class="col-md-4 col-sm-12 px-1" data-target="#bonusesYandexCodes" data-toggle="modal">
  403.                     <img class="cursor-pointer" height="250"  src="/images/yandex_promo_bonuses.png"/>
  404.                 </div>
  405.             </div>
  406.         </div>
  407.         <div class="row">
  408.             <div class="col-12 d-lg-flex cursor-pointer mb-5" id="questions">
  409.                 <div class="col-12 col-lg-6 d-flex">
  410.                     <img class="mr-4" alt="" src="/landing/img/comment.png" style="height: fit-content" data-toggle="modal"
  411.                          data-target="#questionsModal"/>
  412.                     <p class="w-50 color-violet "data-toggle="modal"
  413.                        data-target="#questionsModal">Есть вопросы по работе сервиса? <br> <b>Пишите, ответим оперативно!</b>
  414.                     </p>
  415.                 </div>
  417.                 <div class="col-12 col-lg-6 d-flex flex-end apps-buttons">
  418.                     <a class="google-play" href="https://play.google.com/store/apps/details?id=by.slivki.app">
  419.                         <img class="m-2" height="50" alt="" src="/landing/img/appgallery.png">
  420.                     </a>
  421.                     <a class="google-play" href="https://play.google.com/store/apps/details?id=by.slivki.app">
  422.                         <img class="m-2" height="50" alt="" src="/landing/img/play.png"/>
  423.                     </a>
  424.                     <a class="app-store" href="https://www.slivki.by/app/get">
  425.                         <img class="m-2" height="50" alt="" src="/landing/img/appstore.png"/>
  426.                     </a>
  427.                 </div>
  428.             </div>
  430.         </div>
  431.     </div>
  433. </div>
  434. <input type="hidden" id="subscriptionPath" value="{{ not app.user ? '/auth?path=' }}/profile/subscription/manage?show=">
  435. <input type="hidden" id="offerID" value="{{ offerID }}">
  436. <input type="hidden" id="codesCount" value="{{ codesCount }}">
  437. {% if demoSubscription %}
  438.     {% set isLanding = true %}
  439.     <div id="popupDemoSubscr" class="modal modal--small fade">
  440.         <div class="modal-dialog modal-dialog-centered">
  441.             <div class="modal-content">
  442.                 <div class="modal-header">
  443.                     <div class="close" data-dismiss="modal"></div>
  444.                     <p class="modal-title sf-bold-font mt-4 font-size-1000">Попробуйте преимущества подписки!</p>
  445.                 </div>
  446.                 <div class="p-3 m-4 mt-4 b-sh-block br-04 position-relative ">
  447.                     <div class="d-flex mb-4">
  448.                         <h5 class="text-uppercase align-self-center m-0 font-size-1250 sf-bold-font">{{ demoSubscription.getName() }}</h5>
  449.                         <p class="ml-lg-2 sf-bold-font color-violet"
  450.                            style="font-size: 0.7rem; line-height: 1rem;">{{ demoSubscription.trialPeriod.period }} ДН</p>
  451.                     </div>
  452.                     <h5 class="font-size-1125 sf-bold-font mb-3"><span
  453.                                 class="text-decoration-line-through color-gray mr-1 sf-font font-size-1000"
  454.                                 style="text-decoration-color:rgba(0, 0, 0, 0.3);">{{ demoSubscription.oldPrice }} руб</span>
  455.                         {{ demoSubscription.trialPeriod.price }} руб<span
  456.                                 class="sf-font font-size-1000"> / {{ demoSubscription.trialPeriod.period }} дней</span>
  457.                     </h5>
  458.                     <p class="sf-bold-font mb-4">
  459.                         <span class="color-violet font-size-1600">{{ demoSubscription.trialPeriod.numberOfPromoCodes}}</span>
  460.                         промокод{{ ['', 'а', 'ов']|plural(demoSubscription.trialPeriod.numberOfPromoCodes) }}
  461.                     </p>
  462.                     <p class="mt-2 min-height sf-font mb-0 font-size-0900">{{ demoSubscription.recommendedDescription }}</p>
  463.                     <p class="sf-font color-gray"
  464.                        style="font-size: 0.9em;">{{ demoSubscription.description }}</p>
  465.                     <div class="button-tarif d-flex w-100 mt-2 sf-font">
  466.                         {% set href = '#' %}
  467.                         {% if isLanding %}
  468.                             {% set href = path('profileSubscription', {'show': demoSubscription.id}) %}
  469.                             {% if not app.user %}
  470.                                 {% set href = '/auth?path=' ~ href %}
  471.                             {% endif %}
  472.                         {% endif %}
  473.                         <a data-id="{{ demoSubscription.id }}" data-price="{{ demoSubscription.oldPrice }}"
  474.                            data-period="{{ demoSubscription.period }}" href="{{ href }}"
  475.                            style="height: 3.5rem; line-height: 3.5rem;"
  476.                            class="w-100 p-0 bg-violet border-0 br-04 text-white text-center js-subscribe-btn-popup{{ not isLanding ? ' js-subscribe-btn' }}">
  477.                             ПОДПИСАТЬСЯ
  478.                         </a>
  479.                     </div>
  480.                 </div>
  481.                 <div class="col m-2 p-2 pl-3">
  482.                     <div class="custom-control custom-checkbox font-size-0900">
  483.                         <input type="checkbox" class="custom-control-input" id="applyTermsOfUsePopup" checked="checked">
  484.                         <label class="custom-control-label text-gray" for="applyTermsOfUsePopup">Нажимая на кнопку Вы
  485.                             принимаете <a href="/polzovatelskoe-soglashenie-slivki-by" target="_blank"
  486.                                           style="color:#9c9c9c">Условия подписки</a>.</label>
  487.                     </div>
  488.                 </div>
  489.             </div>
  490.         </div>
  491.     </div>
  492. {% endif %}
  493. {% include 'Slivki/delivery/modal/questions.html.twig' %}
  494. {% include 'Slivki/delivery/modal/questionsSuccess.html.twig' %}
  495. {% include 'Slivki/popups/subscription-bonus.html.twig' %}
  496. <div id="infoPopup" class="modal fade">
  497.     <div class="modal-dialog">
  498.         <div class="modal-content">
  499.             <h4 class="info-popup-title" style="margin-bottom: 2rem;">Информация по условиям бонусов от партнеров</h4>
  500.             <div style="margin-bottom: 2rem;">
  501.                 <div style="margin-bottom: 2rem;">
  502.                     <h5>SLIVKI & Везуха</h5>
  503.                     <p>Всем новым пользователям, при оформлении подписки на Slivki.by,
 Везуха дарит 8 рублей при
  504.                         регистрации.</p>
  505.                     <p style="color: rgba(0, 0, 0, 0.6);">Что такое каршеринг Везуха? Везуха – это ваш автомобиль, но
  506.                         только тогда, когда он нужен. Это удобная аренды автомобиля без водителя со свободной зоной
  507.                         парковки. На чём я поеду в Везухе? Автопарк в основном представлен просторными Kia Rio X-line с
  508.                         коробкой автомат, кондиционером и теплыми опциями, с кабелем для зарядки устройств, мультимедиа
  509.                         и бустерами для маленьких пассажиров. Все автомобили заправлены, помыты, обслужены и
  510.                         застрахованы - вам необходимо только выбрать ближайшую в приложении и отправиться в путь. Куда
  511.                         можно ехать на Везухе? В любую точку Беларуси, главное вернуться в Минск и завершить аренду в
  512.                         разрешенных зонах, которые видны в приложении. Сколько все это стоит? Выбирайте наиболее
  513.                         подходящий для вашей поездки тариф: для города и коротких аренд – умный тариф “Минуты и
  514.                         километры” для более длительных подойдут абонементы на 70 минут, 3, 6 или 12 часов. для поездок
  515.                         “далеко и надолго” предусмотрены - суточный, 50 часовой или недельный абонементы Кто может
  516.                         воспользоваться сервисом? Граждане Республики Беларусь и Российской Федерации, достигшие 20 лет
  517.                         со стажем вождения от 1 года.</p>
  518.                 </div>
  519.                 <div class="subscription-close" data-dismiss="modal"></div>
  520.             </div>
  521.         </div>
  522.     </div>
  523.     <script src="/landing/js/main.js?v=5"></script>
  524.     <script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js"></script>
  525.     <script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery-viewport-checker/1.8.8/jquery.viewportchecker.min.js"></script>
  526.     <script>
  527.         $('.single-item').slick({
  528.             dots: false,
  529.             infinite: false,
  530.             speed: 600,
  531.             slidesToShow: 3,
  532.             slidesToScroll: 1,
  533.             adaptiveHeight: true,
  534.             arrows: false,
  535.             responsive: [
  536.                 {
  537.                     breakpoint: 1000,
  538.                     settings: {
  539.                         slidesToShow: 2,
  540.                     }
  541.                 },
  542.                 {
  543.                     breakpoint: 750,
  544.                     settings: {
  545.                         slidesToShow: 1.8,
  546.                     }
  547.                 },
  549.                 {
  550.                     breakpoint: 600,
  551.                     settings: {
  552.                         slidesToShow: 1.1,
  553.                     }
  554.                 }
  555.             ]
  556.         });
  558.         $('#deliveryFeedbackSubmit').click(function () {
  559.             getRecaptcha();
  560.             let message = $('.js-delivery-feedback-form textarea[name="deliveryFeedback"]').val();
  561.             if (message.length == 0) {
  562.                 $('#questionsModal').modal('hide');
  563.                 $('#collapseDeliveryQuestion').collapse('hide');
  564.                 showNewMessageBox('Ошибка', 'Введите сообщение');
  565.                 return;
  566.             }
  567.             let data = 'name=' + $('.js-delivery-feedback-form input[name="deliveryFeedbackName"]').val() + '&email=' + $('.js-delivery-feedback-form input[name="deliveryFeedbackEmail"]').val() +
  568.                 '&message=' + message;
  569.             $.post('/delivery/feedback/' + $('#offerID').val(), data);
  570.             $('#collapseDeliveryQuestion').collapse('hide');
  571.             $('#questionsModal').modal('hide');
  572.             $('.multi-collapse').collapse();
  573.             $('#questionsSuccessModal').modal();
  574.         });
  576.         $('.js-subscribe-for-legal-btn-landing').on('click', function () {
  577.             let checkedCheckbox = $('[name=forLegalRadio]:checked');
  578.             if (!checkedCheckbox.length) {
  579.                 alert('please, select subscription plan');
  580.                 return false;
  581.             }
  582.             window.location.href = $('#subscriptionPath').val() + checkedCheckbox.val();
  583.             return false;
  584.         });
  585.         $('.packages-subscription-block .button').on('click', function () {
  586.             let that = $(this);
  587.             let thatId = that.attr('id');
  589.             $('.button-tab').each(function (index, item) {
  590.                 let that = $(item);
  591.                 let tabId = that.attr('data-id');
  592.                 if (thatId === tabId) {
  593.                     that.trigger('click');
  594.                 }
  595.             });
  597.             $('html, body').animate({scrollTop: $('.button-tabs').offset().top - 50}, 100);
  598.         });
  599.         $('#payBatchCodesLanding').on('click', function () {
  600.             let planId = $('.radio-pack:checked').val();
  601.             window.location.href = '/auth?path=/profile/subscription/manage?packID=' + planId;
  602.         });
  603.     </script>
  605.     <!-- Yandex.Metrika counter -->
  606.     <script type="text/javascript" >
  607.         (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
  608.             m[i].l=1*new Date();k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
  609.         (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
  611.         ym(20933521, "init", {
  612.             clickmap:true,
  613.             trackLinks:true,
  614.             accurateTrackBounce:true
  615.         });
  616.     </script>
  617.     <noscript><div><img src="https://mc.yandex.ru/watch/20933521" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
  618.     <!-- /Yandex.Metrika counter -->
  619. </div>
  620. </body>
  621. </html>