Add missing constraint.
[wolnelektury.git] / src / wolnelektury / templates / 2022 / main_page.html
1 {% extends "2022/base.html" %}
2 {% load static %}
3 {% load thumbnail %}
4 {% load catalogue_tags %}
5 {% load social_tags %}
6 {% load sponsors %}
7
8 {% block under-menu %}
9   {% comment %}
10     <div class="l-your-books">
11       <div class="l-container">
12         <div class="l-your-books__continue">
13           <div class="l-your-books__header">
14             <h3>Czytaj dalej</h3>
15           </div>
16           <div class="l-books">
17             <article class="l-books__item">
18               <figure class="l-books__item__img">
19                 <a href="#">
20                   <img src="images/book-2.jpg" alt="Wstęp do filozofii">
21                 </a>
22               </figure>
23               <div class="l-books__item__actions">
24                 <a href="#"><i class="icon icon-book"></i></a>
25                 <a href="#"><i class="icon icon-audio"></i></a>
26                 <a href="#"><i class="icon icon-picture"></i></a>
27                 <a href="#"><i class="icon icon-like"></i></a>
28               </div>
29               <h3><a href="#">Stanisław Brzozowski</a></h3>
30               <h2><a href="#">Wstęp do filozofii</a></h2>
31             </article>
32           </div>
33         </div>
34         <div class="l-your-books__shelf">
35           <div class="l-your-books__header">
36             <h3>Moja półka</h3>
37             <div class="l-your-books__header__actions">
38               <button class="js-prev-slide"><i class="icon icon-arrow-left"></i></button>
39               <button class="js-next-slide"><i class="icon icon-arrow-right"></i></button>
40             </div>
41           </div>
42           <div class="l-books">
43             <article class="l-books__item">
44               <figure class="l-books__item__img">
45                 <a href="#">
46                   <img src="images/book-2.jpg" alt="Wstęp do filozofii">
47                 </a>
48               </figure>
49               <div class="l-books__item__actions">
50                 <a href="#"><i class="icon icon-book"></i></a>
51                 <a href="#"><i class="icon icon-audio"></i></a>
52                 <a href="#"><i class="icon icon-picture"></i></a>
53                 <a href="#"><i class="icon icon-like"></i></a>
54               </div>
55               <h3><a href="#">Stanisław Brzozowski</a></h3>
56               <h2><a href="#">Wstęp do filozofii</a></h2>
57             </article>
58             <article class="l-books__item">
59               <figure class="l-books__item__img">
60                 <a href="#">
61                   <img src="images/book-2.jpg" alt="Wstęp do filozofii">
62                 </a>
63               </figure>
64               <div class="l-books__item__actions">
65                 <a href="#"><i class="icon icon-book"></i></a>
66                 <a href="#"><i class="icon icon-audio"></i></a>
67                 <a href="#"><i class="icon icon-picture"></i></a>
68                 <a href="#"><i class="icon icon-like"></i></a>
69               </div>
70               <h3><a href="#">Stanisław Brzozowski</a></h3>
71               <h2><a href="#">Wstęp do filozofii</a></h2>
72             </article>
73             <article class="l-books__item">
74               <figure class="l-books__item__img">
75                 <a href="#">
76                   <img src="images/book-2.jpg" alt="Wstęp do filozofii">
77                 </a>
78               </figure>
79               <div class="l-books__item__actions">
80                 <a href="#"><i class="icon icon-book"></i></a>
81                 <a href="#"><i class="icon icon-audio"></i></a>
82                 <a href="#"><i class="icon icon-picture"></i></a>
83                 <a href="#"><i class="icon icon-like"></i></a>
84               </div>
85               <h3><a href="#">Stanisław Brzozowski</a></h3>
86               <h2><a href="#">Wstęp do filozofii</a></h2>
87             </article>
88             <article class="l-books__item">
89               <figure class="l-books__item__img">
90                 <a href="#">
91                   <img src="images/book-2.jpg" alt="Wstęp do filozofii">
92                 </a>
93               </figure>
94               <div class="l-books__item__actions">
95                 <a href="#"><i class="icon icon-book"></i></a>
96                 <a href="#"><i class="icon icon-audio"></i></a>
97                 <a href="#"><i class="icon icon-picture"></i></a>
98                 <a href="#"><i class="icon icon-like"></i></a>
99               </div>
100               <h3><a href="#">Stanisław Brzozowski</a></h3>
101               <h2><a href="#">Wstęp do filozofii</a></h2>
102             </article>
103             <article class="l-books__item">
104               <figure class="l-books__item__img">
105                 <a href="#">
106                   <img src="images/book-2.jpg" alt="Wstęp do filozofii">
107                 </a>
108               </figure>
109               <div class="l-books__item__actions">
110                 <a href="#"><i class="icon icon-book"></i></a>
111                 <a href="#"><i class="icon icon-audio"></i></a>
112                 <a href="#"><i class="icon icon-picture"></i></a>
113                 <a href="#"><i class="icon icon-like"></i></a>
114               </div>
115               <h3><a href="#">Stanisław Brzozowski</a></h3>
116               <h2><a href="#">Wstęp do filozofii</a></h2>
117             </article>
118             <article class="l-books__item l-books__item--placeholder">
119               <figure class="l-books__item__img">
120                 <a href="#">
121                   <img src="images/book-2.jpg" alt="Wstęp do filozofii">
122                 </a>
123               </figure>
124               <div class="l-books__item__actions">
125                 <a href="#"><i class="icon icon-book"></i></a>
126                 <a href="#"><i class="icon icon-audio"></i></a>
127                 <a href="#"><i class="icon icon-picture"></i></a>
128                 <a href="#"><i class="icon icon-like"></i></a>
129               </div>
130               <h3><a href="#">Stanisław Brzozowski</a></h3>
131               <h2><a href="#">Wstęp do filozofii</a></h2>
132             </article>
133           </div>
134         </div>
135       </div>
136     </div>
137   {% endcomment %}
138 {% endblock %}
139
140 {% block global-content %}
141   <main class="l-main">
142
143     {% if widget %}
144       <section class="l-section">
145         <iframe src="{{ widget}}" style="width: 100%; height: 600px; border: none;"></iframe>
146       </section>
147     {% endif %}
148
149     {% if recommended_collection %}
150       <section class="l-section">
151         <div class="l-collections js-collections">
152           <div class="l-collections__header">
153             <h3><a href="{{ recommended_collection.get_absolute_url }}">{{ recommended_collection.title }}</a></h3>
154             <div class="l-your-books__header__actions">
155               <button class="js-prev-slide"><i class="icon icon-arrow-left"></i></button>
156               <button class="js-next-slide"><i class="icon icon-arrow-right"></i></button>
157             </div>
158           </div>
159           <div class="l-books">
160             {% for book in recommended_collection.get_books %}
161               {% include 'catalogue/2022/book_box.html' %}
162             {% endfor %}
163           </div>
164           <div class="c-read_more">
165             <a href="/katalog/kolekcje/">zobacz wszystkie kolekcje</a>
166           </div>
167         </div>
168
169       </section>
170     {% endif %}
171
172     <section class="l-section">
173       <div class="p-homepage__info">
174         <div class="p-homepage__info__box p-homepage__info__box--carousel">
175           {% carousel_2022 'main_2022' %}
176         </div>
177         <div class="p-homepage__info__box p-homepage__info__box--donate">
178           <figure>
179             <img src="{% static '2022/images/book-donate.svg' %}" alt="Dorzuć się!">
180           </figure>
181           <div class="p-homepage__info__box__content">
182             <p>
183               Nasze książki są dostępne dla tysięcy
184               dzieciaków dzięki <strong>darowiznom</strong> od
185               osób takich jak <strong>Ty</strong>!
186             </p>
187             <a href="{% url 'club_join' %}?pk_campaign=home" class="l-button l-button--default l-button--default--dark">Dorzuć się!</a>
188           </div>
189         </div>
190         <div class="p-homepage__info__box p-homepage__info__box--newsletter">
191           <figure>
192             <img src="{% static '2022/images/book-newsletter.svg' %}" alt="Zapisz się na nasz Newsletter!">
193           </figure>
194           <div class="p-homepage__info__box__content">
195             <h3>
196               Informacja o&nbsp;nowościach <strong>Newsletter!</strong>
197             </h3>
198             <a href="{% url 'subscribe' %}?pk_campaign=home" class="l-button l-button--default">Zapisz się</a>
199           </div>
200         </div>
201       </div>
202     </section>
203
204     <section class="l-section l-section--row">
205       <div class="l-quotes" style="">
206         {% for ambassador in ambassadors %}
207           <div class="l-quotes__item">
208             {% thumbnail ambassador.photo '100x100' crop="center" as ambphoto %}
209             <img src="{{ ambphoto.url  }}" alt="{{ ambassador.name }}">
210               {% endthumbnail %}
211               <h4>{{ ambassador.name }}</h4>
212               <p>
213                 {{ ambassador.text }}
214               </p>
215           </div>
216         {% endfor %}
217       </div>
218
219       <div class="l-quotes-ad" style="">
220         {% preview_ad_homepage %}
221       </div>
222
223     </section>
224
225     <section class="l-section">
226       <div class="p-homepage__info p-homepage__info--second">
227         <div class="p-homepage__info__box p-homepage__info__box--full">
228           <figure>
229             <img src="{% static '2022/images/kid.png' %}" alt="Dorzuć się!">
230           </figure>
231           <div class="p-homepage__info__box__content">
232             <p>
233               <strong>Wolne Lektury</strong> to lektury szkolne
234               i tysiące innych książek – za <strong>darmo</strong>
235               i <strong>bez rejestracji</strong>.
236             </p>
237             <p>Czytaj i słuchaj online, ściągaj na swój telefon lub komputer, dziel się z innymi.</p>
238             <p>Dla uczennic i uczniów dodajemy przypisy, motywy literackie, biogramy i geotagowanie.</p>
239             <a href="{% url 'infopage' 'o-projekcie' %}?pk_campaign=wl-infobox" class="l-button l-button--default l-button--default--dark">Dowiedz się więcej</a>
240           </div>
241         </div>
242         <div class="p-homepage__info__box__rows">
243           <div class="p-homepage__info__box p-homepage__info__box--full--sm">
244             <figure>
245               <img src="{% static '2022/images/kid-2.png' %}" alt="Dorzuć się!">
246             </figure>
247             <div class="p-homepage__info__box__content">
248               <p>
249                 Jesteśmy częścią ruchu <strong>wolnej kultury</strong>!
250               </p>
251               <a href="https://nowoczesnapolska.org.pl/o-fundacji/?pk_campaign=wl-infobox" class="l-button l-button--default">Dowiedz się więcej</a>
252             </div>
253           </div>
254           <div class="p-homepage__info__box p-homepage__info__box--full--sm">
255             <figure>
256               <img src="{% static '2022/images/kid-3.png' %}" alt="Dorzuć się!">
257             </figure>
258             <div class="p-homepage__info__box__content">
259               <p>
260                 Jak budujemy najpopularniejszą <strong>bibliotekę online</strong> w Polsce
261               </p>
262               <a href="/info/jak-powstaja-wolne-lektury/" class="l-button l-button--default">Dowiedz się więcej</a>
263             </div>
264           </div>
265         </div>
266       </div>
267     </section>
268   </main>
269
270
271   <section class="l-section">
272     <div class="l-collections js-collections">
273       <div class="l-collections__header">
274         <h3><a href="/katalog/nowe/">Nowości</a></h3>
275         <div class="l-your-books__header__actions">
276           <button class="js-prev-slide"><i class="icon icon-arrow-left"></i></button>
277           <button class="js-next-slide"><i class="icon icon-arrow-right"></i></button>
278         </div>
279       </div>
280       <div class="l-books" style="display:block;">
281         {% for book in last_published %}
282           {% include 'catalogue/2022/book_box.html' %}
283         {% endfor %}
284       </div>
285     </div>
286   </section>
287
288   <div class="l-container">
289     <section class="l-section">
290       <div class="p-homepage__uptodate">
291         <div class="p-homepage__uptodate__header">
292           <h3>Bądź na bieżąco</h3>
293           <ul>
294             <li>
295               <a href="https://www.facebook.com/wolnelektury/"
296                  title="Facebook" tabindex="-1" target="_blank">
297                 <i class="icon icon-fb" aria-hidden="true"></i>
298               </a>
299             </li>
300             <li>
301               <a href="https://www.youtube.com/c/WolneLekturyYT/"
302                  title="YouTube" tabindex="-1" target="_blank">
303                 <i class="icon icon-yt" aria-hidden="true"></i>
304               </a>
305             </li>
306             <li>
307               <a href="https://www.instagram.com/wolnelektury/"
308                  title="Instagram" tabindex="-1" target="_blank">
309                 <i class="icon icon-ig" aria-hidden="true"></i>
310               </a>
311             </li>
312             <li>
313               <a href="https://twitter.com/wolnelektury"
314                  title="Twitter" tabindex="-1" target="_blank">
315                 <i class="icon icon-tt" aria-hidden="true"></i>
316               </a>
317             </li>
318           </ul>
319         </div>
320
321         {% sponsor_page 'footer' %}
322
323       </div>
324     </section>
325   </div>
326
327 {% endblock %}