2018-lpon-site/lpon_site/templates/block/allow-tracking.html

{# НИЖНИЙ POPUP О КУКАХ И ОТСЛЕЖИВАНИИ #}
{% comment %}
Всплывающее уведомление о согласии на использование файлов cookie и аналитики (согласно 152-ФЗ и GDPR).
При нажатии на кнопку "Принять":
1. Устанавливается кука `allow_tracking=1` со сроком действия 1 год (max-age=31536000) и path=/.
2. Всплывающее окно скрывается пользователю.
3. При следующих запросах контекстный процессор `site_context` обнаруживает наличие куки `allow_tracking`,
   не отображает данный баннер и подключает скрипты аналитики (analytics.js).
{% endcomment %}
<div id="allow-tracking-popup"
     x-data="{ visible: true }"
     x-show="visible"
     x-transition:leave="transition ease-in duration-300"
     x-transition:leave-start="opacity-100 transform translate-y-0"
     x-transition:leave-end="opacity-0 transform translate-y-4"
     class="sticky bottom-0 z-50 bg-gray-100/80 dark:bg-slate-800/70 backdrop-blur">
  <div class="max-w-7xl mx-auto px-4 py-0 border-b border-gray-200 dark:border-gray-800 grid grid-cols-[auto_1fr] gap-x-4">
    <p class="flex-col px-6 py-6">
      В&nbsp;соответствии с&nbsp;<abbr title="General Data Protection Regulation">GDPR</abbr>
      и&nbsp;152-<abbr title="Федеральный закон">ФЗ</abbr>, уведомляем вас, что сайт lpon.ru с&nbsp;целью аналитики
      и&nbsp;улучшения своей работы использует файлы cookie и&nbsp;инструменты сбора обезли&shy;ченных данных
      о&nbsp;поведении пользо&shy;вателей. Оставаясь на&nbsp;сайте, вы&nbsp;соглашаетесь с&nbsp;нашей
      <a href="{% url 'info_article_detail' slug='privacy-policy' %}">политикой конфи&shy;денциаль&shy;ности</a>.
    </p>
    <button id="cookie-accept"
            @click="document.cookie = 'allow_tracking=1; path=/; max-age=31536000; SameSite=Lax'; visible = false;"
            onclick="document.cookie = 'allow_tracking=1; path=/; max-age=31536000; SameSite=Lax'; const el = document.getElementById('allow-tracking-popup'); if (el) { el.style.display = 'none'; }"
            class="text-lg px-6 py-2 my-6 border-2 rounded-md cursor-pointer hover:bg-gray-200 dark:hover:bg-gray-700 transition-colors">
      Принять
    </button>
  </div>
</div>{# / НИЖНИЙ POPUP О КУКАХ И ОТСЛЕЖИВАНИИ #}