src/club/templates/club/2022/donation_step_base.html

   1 {% extends '2022/base.html' %}
   2 {% load chunks %}
   3 {% load club %}
   4 {% load static %}
   5
   6
   7 {% block content %}
   8   <div class="l-container">
   9     <div class="l-breadcrumb">
  10       <a href="#"><span>Strona główna</span></a>
  11       <a href="#"><span>Wesprzyj nas</span></a>
  12     </div>
  13   </div>
  14
  15
  16   <main class="l-main">
  17     <div class="l-checkout__support">
  18       <div class="l-checkout__support__bar">
  19         <span data-label="Jest nas {% club_count_recurring %}" style="width: calc({% club_count_recurring %}% / 10);"></span>
  20       </div>
  21       <div class="l-checkout__support__footer">
  22         <p>Dołącz do naszych stałych <strong>darczyńców</strong>!</p>
  23         <p>Minimalną stabilność uzyskamy przy <strong>1000</strong> regularnych darczyńców!</p>
  24       </div>
  25     </div>
  26
  27     <div class="l-checkout__box">
  28       <div class="l-checkout__box__header">
  29         <img src="{% block donation-jumbo-image %}{% static '2022/images/checkout-img-1.jpg' %}{% endblock %}" alt="Wspieraj Wolne Lektury">
  30         <div class="l-checkout__box__header__content">
  31           <h1>Wspieraj Wolne Lektury</h1>
  32           <p>Dziękujemy, że chcesz razem z nami uwalniać książki!</p>
  33           <p>Wspieraj Wolne Lektury stałą wpłatą – nawet niewielka ma wielką moc! Możesz też wesprzeć Wolne Lektury jednorazowo.</p>
  34         </div>
  35       </div>
  36       <div class="l-checkout__steps">
  37
  38         {% if view.step > 1 and view.step != 4 %}
  39           <a href="{% url 'donation_step1' schedule.key %}">
  40         {% endif %}
  41         <div class="{% if view.step == 1 %}is-current{% else %}is-completed{% endif %}">
  42           <span>1</span>
  43           <p>Rodzaj wsparcia</p>
  44         </div>
  45         {% if view.step > 1 and view.step != 4 %}
  46           </a>
  47         {% endif %}
  48
  49         {% if view.step != 2 and schedule and view.step != 4 %}
  50           <a href="{% url 'donation_step2' schedule.key %}">
  51         {% endif %}
  52         <div class="{% if view.step == 2 %}is-current{% elif not schedule %}is-inactive{% else %}is-completed{% endif %}">
  53           <span>2</span>
  54           <p>Dane</p>
  55         </div>
  56         {% if view.step != 2 and schedule and view.step != 4 %}
  57           </a>
  58         {% endif %}
  59
  60         {% if view.step != 3 and schedule.email and view.step != 4 %}
  61           <a href="{{ schedule.get_absolute_url }}">
  62         {% endif %}
  63         <div class="{% if view.step == 3 %}is-current{% elif not schedule or not schedule.method %}is-inactive{% else %}is-completed{% endif %}">
  64           <span>3</span>
  65           <p>Forma płatności</p>
  66         </div>
  67         {% if view.step != 3 and schedule.email and view.step != 4 %}
  68           </a>
  69         {% endif %}
  70
  71         <div class="{% if view.step == 4 %}is-completed{% else %}is-inactive{% endif %}">
  72           <span>4</span>
  73           <p>Gotowe</p>
  74         </div>
  75       </div>
  76
  77
  78       {% block donation-step-content %}{% endblock %}
  79
  80     </div>
  81
  82     <div class="l-checkout__footer">
  83       <div class="l-checkout__footer__content">
  84         <div class="l-checkout__footer__content__item">
  85           <h3>Transparentność jest dla nas bardzo ważna.</h3>
  86           <div>
  87             <div class="l-article__overlay" data-max-height="91">
  88               {% chunk 'donation-transparency' %}
  89             </div>
  90           </div>
  91         </div>
  92         <div class="l-checkout__footer__content__item">
  93           <h3>Informacja o przetwarzaniu danych osobowych</h3>
  94           <div>
  95             <div class="l-article__overlay" data-max-height="91">
  96               {% chunk 'donation-data-processing' %}
  97             </div>
  98             <button class="l-article__read-more" aria-label="Kliknij aby rozwinąć" data-label="Więcej" data-action="Mniej">Więcej</button>
  99           </div>
 100         </div>
 101         <div class="l-checkout__footer__content__item">
 102           <h3>FAQ</h3>
 103           <div>
 104             <div class="l-article__overlay" data-max-height="91">
 105               {% chunk 'donation-faq' %}
 106             </div>
 107           </div>
 108         </div>
 109       </div>
 110     </div>
 111   </main>
 112
 113
 114
 115 {% endblock %}