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 %}