-<!doctype html>
-{% load pipeline %}
+{% extends '2022/base.html' %}
+
+{% load chunks %}
{% load static %}
{% load choose_cites from social_tags %}
-{% load choose_fragment license_icon from catalogue_tags %}
{% load catalogue_tags %}
{% load likes_book from social_tags %}
-{% load piwik_tags %}
-
-
-<html class="no-js">
- <head>
- <meta charset="utf-8">
- <meta name="description" content="">
- <meta name="viewport" content="width=device-width,initial-scale=1">
- <title>WolneLektury.pl</title>
- <link rel="apple-touch-icon" href="apple-touch-icon.png">
-
- {% stylesheet '2022' %}
- <script src="scripts/modernizr.js"></script>
-
- <link rel="preconnect" href="https://fonts.googleapis.com">
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
- <link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,300;0,400;0,600;0,700;1,300;1,400&display=swap" rel="stylesheet">
-
- {% tracking_code %}
- </head>
- <body>
-
- <nav class="l-navigation">
- <div class="l-change-pop">
- <h3>Zmieniamy się!</h3>
- <p>
- Jeżeli to czytasz jesteś jedną z osób, której prezentujemy nowy wygląd strony książki.
- Będziemy bardzo! wdzięczni za Twoją opinię – <a href='/formularz/ux-strona-ksiazki-T1/' target="_blank">możesz nam ją przesłać tutaj</a>.
- Jeżeli wolisz klasyczny wygląd - wystarczy, że <a class="quit-experiment" href="#">klikniesz tutaj</a>
- </p>
- <!-- button class="l-change-pop__close">
- <i class="icon icon-close"></i>
- </button -->
- </div>
- <div class="l-container">
- <a href="/" class="l-navigation__logo">
- <img src="{% static "2022/images/logo.png" %}" alt="WolneLektury.pl">
- </a>
- <div class="l-naviagion__search">
- <form action="/szukaj/">
- <input id="search" name="q" type="text" placeholder="szukaj tytułu, autora, motywów…" autocomplete="off" data-source="/szukaj/hint/?max=10">
- </form>
- </div>
- <div class="l-navigation__actions">
- <a href="/ludzie/polka/"><i class="icon icon-liked"></i></a>
- <!-- button class="l-navigation__button js-menu" aria-label="Menu">
- <span class="c-hamburger">
- <span class="bar"></span>
- </span>
- </button-->
- </div>
- </div>
- </nav>
+{% block global-content %}
<div class="l-container">
<div class="l-breadcrumb">
<a href="/"><span>Strona główna</span></a>
</div>
- <main class="l-main">
- <section class="l-section">
+ <main class="l-main page-book">
+ <section class="l-section lay-s-col-rev">
{% with first_text=book.get_first_text %}
<aside class="l-aside">
- <figure>
- {% if first_text %}
+ <figure class="only-l">
+ {% if accessible and first_text %}
<a href="{% url 'book_text' first_text.slug %}">
{% endif %}
<img src="{% if book.cover_clean %}{{ book.cover_clean.url }}{% endif %}" alt="{{ book.pretty_title }}" width="240">
- {% if first_text %}
+ {% if accessible and first_text %}
</a>
{% endif %}
</figure>
</p>
{% endif %}
</div>
- <div class="l-header__actions">
- {% likes_book book as likes %}
+
+
+
+ {% likes_book book as likes %}
+ <div class="l-header__actions only-l">
{% if likes %}
<form method='post' action='{% url 'social_unlike_book' book.slug %}'>
{% csrf_token %}
</div>
</header>
<article class="l-article">
- <div class="c-media">
- <div class="c-media__actions">
+
+
+
+
+
+ {% if accessible %}
+ <div class="c-media">
+ <div class="lay-row lay-l-block lay-spread">
+ <figure class="only-s book-cover-small">
+ {% if accessible and first_text %}
+ <a href="{% url 'book_text' first_text.slug %}">
+ {% endif %}
+ <img src="{% if book.cover_clean %}{{ book.cover_clean.url }}{% endif %}" alt="{{ book.pretty_title }}">
+ {% if accessible and first_text %}
+ </a>
+ {% endif %}
+ </figure>
+ <div class="lay-col lay-spread lay-grow">
+ <div class="l-header__actions only-s">
+ {% if likes %}
+ <form method='post' action='{% url 'social_unlike_book' book.slug %}'>
+ {% csrf_token %}
+ <button class="l-button l-button--fav">
+ <img src="{% static '2022/images/faved.svg' %}" alt="Usuń z ulubionych">
+ </button>
+ </form>
+ {% else %}
+ <form method='post' action='{% url 'social_like_book' book.slug %}'>
+ {% csrf_token %}
+ <button class="l-button l-button--fav">
+ <img src="{% static '2022/images/fav.svg' %}" alt="Dodaj do ulubionych">
+ </button>
+ </form>
+ {% endif %}
+ </div>
+ <div class="c-media__actions lay-col lay-l-row">
<div class="c-media__btn">
{% if book.has_mp3_file %}
<button class="l-button l-button--media" id="audiobook"><i class="icon icon-audio"></i> pobierz audiobook</button>
<a href="{% url 'book_text' first_text.slug %}" class="l-button l-button--media l-button--media--full"><i class="icon icon-eye"></i> czytaj online</a>
{% endif %}
</div>
- </div>
+ </div>
+ </div>
+ </div>
</div>
</div>
{% endif %}
- {% if book.has_synchro_file %}
+ {% if book.has_audio_epub_file %}
<div class="c-media__popup__box__item">
<div>
- <h3>synchrobook</h3>
+ <h3>EPUB + audiobook</h3>
<p>Książka elektroniczna i audiobook w jednym. Wymaga aplikacji obsługującej format.</p>
</div>
<div>
- <a href="#" class="l-button l-button--media l-button--media--full">synchrobook</a>
+ {% for epub in book.media_audio_epub %}
+ <a href="{{ epub.file.url }}" class="l-button l-button--media l-button--media--full">EPUB+audio</a>
+ {% endfor %}
</div>
</div>
{% endif %}
</div>
{% endif %}
</div>
+ {% else %}
+ <div style="margin-bottom: 1.5rem; font-size: 15px; like-height: 150%; color: #808080;">
+ {% chunk 'book-preview-warn' %}
+ </div>
+
+ <div class="l-checkout__box">
+ {% include 'club/2022/donation_step1_form.html' with form=donation_form %}
+ </div>
+ {% endif %}
<div class="l-article__overlay" data-max-height="327">
{{ book.abstract|safe }}
{% if book.toc %}
- <h4>Spis treści:</h4>
- {{ book.toc|safe }}
+ <div class="toc">
+ <h4>Spis treści:</h4>
+ {{ book.toc|safe }}
+ </div>
{% endif %}
</div>
<button class="l-article__read-more" aria-label="Kliknij aby rozwinąć" data-label="Czytaj więcej" data-action="Zwiń tekst">Czytaj więcej</button>
</article>
+ {% if accessible %}
<div class="c-support">
<div>
<h2>Ta książka jest dostępna dla tysięcy dzieciaków dzięki <span>darowiznom</span> od osób takich jak <span>Ty</span>!</h2>
<a href="{% url 'club_join' %}?pk_campaign=layout">Dorzuć się!</a>
</div>
- <figure>
- <img src="{% static '2022/images/dziecko.jpeg' %}" alt="Dorzuć się!">
- </figure>
+ <div class="bg">
+ <!-- img src="{% static '2022/images/dziecko.jpeg' %}" alt="Dorzuć się!" -->
+ </div>
</div>
+ {% endif %}
</div>
{% endwith %}
</section>
{% for author in book.authors %}
<section class="l-section">
<div class="l-author">
- <div class="row">
- <h2>O autorze</h2>
- <div>
- {% if author.photo %}
- <figure class="l-author__photo">
- <img src="{{ author.photo.url }}" alt="{{ author.name }}" style="width: 238px;">
- <figcaption>
- {{ author.photo_attribution|safe }}
- </figcaption>
- </figure>
- {% endif %}
- <article class="l-author__info">
- <h3><a href="{{ author.get_absolute_url }}">{{ author.name }}</a></h3>
- <div class="l-article__overlay" data-max-height="327">
- {{ author.description|safe }}
- </div>
- <button class="l-article__read-more" aria-label="Kliknij aby rozwinąć" data-label="Czytaj więcej" data-action="Zwiń tekst">Czytaj więcej</button>
- </article>
- </div>
- </div>
+ {% include 'catalogue/2022/author_box.html' %}
- {% choose_cites book 3 as cites %}
+ {% choose_cites 3 book=book as cites %}
{% if cites %}
<div class="row">
<div class="l-author__quotes">
<div class="l-author__quotes__slider">
{% for fragment in cites %}
- <a class="l-author__quotes__slider__item" href="{{ fragment.get_absolute_url }}">
-
- <em>
- {{ fragment.short_text|safe }}
- </em>
- <p>{{ fragment.book.pretty_title }}</p>
- </a>
+ {% include "catalogue/2022/fragment_slider_box.html" %}
{% endfor %}
</div>
</div>
{% if book.wiki_link %}
<li><a href="{{ book.wiki_link }}">strona utworu w Wikipedii</a></li>
{% endif %}
+ {% if accessible %}
<li>
<a href="{{ book.xml_url }}">źródłowy plik XML</a>
</li>
<li>
<a target="_blank" href="{{ book.get_extra_info_json.about }}">utwór na Platformie Redakcyjnej</a>
</li>
+ {% endif %}
</ul>
</div>
</section>
</div>
</section>
- <div class="l-footer">
- <div class="l-container">
- <div class="l-footer__row">
- <a href="#"><img src="{% static '2022/images/FNP-logo.png' %}" alt="FUNDACJA Nowoczesna Polska"></a>
- <ul>
- <li>ul. Marszałkowska 84/92 lok. 125</li>
- <li>00-514 Warszawa</li>
- </ul>
- <ul class="teal">
- <li>tel. <a href="#">(22) 621 30 17</a></li>
- <li>email <a href="#">fundacja@nowoczesnapolska.org.pl</a></li>
- </ul>
- </div>
- <div class="l-footer__row">
- <div>
- Wolne Lektury to projekt prowadzony przez fundację <a href="#">Nowoczesna Polska</a>. <br>
- Hosting: <a href="#">ICM</a>.
- </div>
- <div>
- <a href="#"><img src="{% static '2022/images/MKiDN.png' %}" alt="MKiDN"></a>
- </div>
- <div>
- Strona biblioteki Wolne Lektury powstała dzięki dofinansowaniu ze środków Ministra <a href="#">Kultury i Dziedzictwa Narodowego</a>
- pochodzących z <a href="#">Funduszu Promocji Kultury</a> – państwowego funduszu celowego.
- </div>
- </div>
- </div>
- </div>
- <script src="{% static '2022/scripts/vendor.js' %}"></script>
- <script src="{% static '2021/scripts/main.js' %}"></script>
-
- {% javascript '2022' %}
- {% javascript '2022_player' %}
- <!-- Hotjar Tracking Code for https://wolnelektury.pl/ -->
- <script>
- (function(h,o,t,j,a,r){
- h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
- h._hjSettings={hjid:2661024,hjsv:6};
- a=o.getElementsByTagName('head')[0];
- r=o.createElement('script');r.async=1;
- r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
- a.appendChild(r);
- })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
- </script>
- </body>
-</html>
+{% endblock %}