From a4cf06ec9135a9375fbc9ed2c697bc60ad6052b5 Mon Sep 17 00:00:00 2001
From: Radek Czajka <rczajka@rczajka.pl>
Date: Tue, 13 Sep 2022 15:56:55 +0200
Subject: [PATCH] New layout fixes.
---
.../templates/catalogue/2022/book_box.html | 2 +-
.../catalogue/2022/theme_detail.html | 2 +-
.../templates/catalogue/preview_ad.html | 18 ++-
src/catalogue/templatetags/catalogue_tags.py | 8 +-
src/chunks/templates/chunks/menu.html | 4 +
src/chunks/templatetags/chunks.py | 10 +-
.../templates/club/2022/donation_step1.html | 3 +
.../club/2022/donation_step_base.html | 23 +---
src/wolnelektury/settings/static.py | 2 +
.../static/2022/images/korona.svg | 3 +
src/wolnelektury/static/2022/more.scss | 61 +++++++++-
src/wolnelektury/templates/2022/header.html | 113 +++++++++---------
12 files changed, 157 insertions(+), 92 deletions(-)
create mode 100644 src/wolnelektury/static/2022/images/korona.svg
diff --git a/src/catalogue/templates/catalogue/2022/book_box.html b/src/catalogue/templates/catalogue/2022/book_box.html
index 2d2ac05e6..db6bfb103 100644
--- a/src/catalogue/templates/catalogue/2022/book_box.html
+++ b/src/catalogue/templates/catalogue/2022/book_box.html
@@ -20,7 +20,7 @@
{% if book.is_book %}
<span class="icon icon-book-alt" title="ksiÄ
żka"></span>
{% endif %}
- {% if book.has_mp3 %}
+ {% if book.has_mp3_file %}
<span class="icon icon-audio" title="audiobook"></span>
{% endif %}
{% if book.is_picture %}
diff --git a/src/catalogue/templates/catalogue/2022/theme_detail.html b/src/catalogue/templates/catalogue/2022/theme_detail.html
index 622b6b521..71ec04660 100644
--- a/src/catalogue/templates/catalogue/2022/theme_detail.html
+++ b/src/catalogue/templates/catalogue/2022/theme_detail.html
@@ -57,7 +57,7 @@
<div class="l-books__item__content">
<div class="l-books__item__actions">
<a href="#" class="icon icon-book-alt"></a>
- {% if fragment.book.has_mp3 %}
+ {% if fragment.book.has_mp3_file %}
<a href="#" class="icon icon-audio"></a>
{% endif %}
</div>
diff --git a/src/catalogue/templates/catalogue/preview_ad.html b/src/catalogue/templates/catalogue/preview_ad.html
index 33ea77329..85b4ed2ff 100644
--- a/src/catalogue/templates/catalogue/preview_ad.html
+++ b/src/catalogue/templates/catalogue/preview_ad.html
@@ -1,8 +1,18 @@
{% if book %}
- <p>
- <strong>Prapremiera!</strong>
- DziÄkujemy za wsparcie â przeczytaj w prezencie już dzisiaj!
- </p>
+ <div class="l-navigation__menu__book__header">
+ {% if accessible %}
+ <p class='korona'>
+ <strong>Prapremiera!</strong>
+ DziÄkujemy za wsparcie â przeczytaj w prezencie już dzisiaj!
+ </p>
+ {% else %}
+ <p>
+ <strong>Prapremiera!</strong>
+ DorzuÄ siÄ, aby przeczytaÄ.
+ </p>
+ <a class="button" href="{% url 'club_join' %}?pk_campaign=menu-preview">DorzuÄ siÄ</a>
+ {% endif %}
+ </div>
<div class="l-navigation__menu__book__info">
<a href="{{ book.get_absolute_url }}" tabindex="-1">
<img src="{{ book.cover_clean.url }}" alt="{{ book.pretty_title }}">
diff --git a/src/catalogue/templatetags/catalogue_tags.py b/src/catalogue/templatetags/catalogue_tags.py
index 93b6f1c42..f4f121d80 100644
--- a/src/catalogue/templatetags/catalogue_tags.py
+++ b/src/catalogue/templatetags/catalogue_tags.py
@@ -530,8 +530,10 @@ def content_warning(book):
}
-@register.inclusion_tag('catalogue/preview_ad.html')
-def preview_ad():
+@register.inclusion_tag('catalogue/preview_ad.html', takes_context=True)
+def preview_ad(context):
+ book = Book.objects.filter(preview=True).first()
return {
- 'book': Book.objects.filter(preview=True).first()
+ 'accessible': book.is_accessible_to(context['request'].user),
+ 'book': book,
}
diff --git a/src/chunks/templates/chunks/menu.html b/src/chunks/templates/chunks/menu.html
index 56ccfa258..ed6669a5f 100644
--- a/src/chunks/templates/chunks/menu.html
+++ b/src/chunks/templates/chunks/menu.html
@@ -4,8 +4,12 @@
<a href="{{ item.final_link }}" tabindex="-1">
{% endif %}
{% if item.highlight %}
+ <em>
{% endif %}
{{ item.final_name }}
+ {% if item.highlight %}
+ </em>
+ {% endif %}
{% if item.has_link %}
</a>
{% endif %}
diff --git a/src/chunks/templatetags/chunks.py b/src/chunks/templatetags/chunks.py
index e86288ef7..7c431c13d 100644
--- a/src/chunks/templatetags/chunks.py
+++ b/src/chunks/templatetags/chunks.py
@@ -11,8 +11,8 @@ from ..models import Chunk, Attachment
register = template.Library()
-@register.simple_tag
-def chunk(key, cache_time=0):
+@register.simple_tag(takes_context=True)
+def chunk(context, key, cache_time=0):
try:
cache_key = 'chunk:%s:%s' % (key, get_language())
c = cache.get(cache_key)
@@ -23,7 +23,11 @@ def chunk(key, cache_time=0):
except Chunk.DoesNotExist:
n = Chunk(key=key)
n.save()
- return ''
+ content = ''
+
+ if context['request'].user.is_staff:
+ content = f'<span data-edit="chunks/chunk/{key}"></span>' + content
+
return mark_safe(content)
diff --git a/src/club/templates/club/2022/donation_step1.html b/src/club/templates/club/2022/donation_step1.html
index 057ab4199..2f28d069d 100644
--- a/src/club/templates/club/2022/donation_step1.html
+++ b/src/club/templates/club/2022/donation_step1.html
@@ -10,6 +10,9 @@
<input type="radio" name="switch" id="switch-once" value="single" class="toggle-input" {% if schedule and not schedule.monthly %}checked{% endif %}>
<input type="radio" name="switch" id="switch-monthly" value="monthly" class="toggle-input" {% if not schedule or schedule.monthly %}checked{% endif %}>
<div class="l-switch__wrapper">
+ {% if user.is_staff %}
+ <span data-edit="club/club/{{ club.pk }}"></span>
+ {% endif %}
<div class="l-switch white">
<label class='toggle-for' for="switch-once">Jednorazowo</label>
diff --git a/src/club/templates/club/2022/donation_step_base.html b/src/club/templates/club/2022/donation_step_base.html
index 976b13c0c..df264933f 100644
--- a/src/club/templates/club/2022/donation_step_base.html
+++ b/src/club/templates/club/2022/donation_step_base.html
@@ -1,4 +1,5 @@
{% extends '2022/base.html' %}
+{% load chunks %}
{% load club %}
{% load static %}
@@ -84,9 +85,7 @@
<h3>TransparentnoÅÄ jest dla nas bardzo ważna.</h3>
<div>
<div class="l-article__overlay" data-max-height="91">
- <p>
- O tym, jak wydajemy pozyskane pieniÄ
dze, dowiesz siÄ ze sprawozdaÅ finansowych i merytorycznych, które znajdziesz na naszej stronie lub w bazie Narodowego Instytutu WolnoÅci, wpisujÄ
c nr KRS 0000070056.
- </p>
+ {% chunk 'donation-transparency' %}
</div>
</div>
</div>
@@ -94,18 +93,7 @@
<h3>Informacja o przetwarzaniu danych osobowych</h3>
<div>
<div class="l-article__overlay" data-max-height="91">
- <p>
- W każdej chwili możesz zrezygnowaÄ z subskrypcji. <a href="#">WiÄcej informacji. Polityka prywatnoÅci.</a>
- Administratorem Twoich danych osobowych jest Fundacja Nowoczesna Polska z siedzibÄ
w Warszawie, przy ul. MarszaÅkowskiej 84/92 lok. 125, 00-514 Warszawa (dalej: Fundacja).
- </p>
- <p>
- Lorem ipsum dolor sit amet, consectetur adipisicing elit. A alias consequatur deserunt doloribus facilis, ipsum nisi nulla quam rem totam!
- Lorem ipsum dolor sit amet, consectetur adipisicing elit. A alias consequatur deserunt doloribus facilis, ipsum nisi nulla quam rem totam!
- </p>
- <p>
- Lorem ipsum dolor sit amet, consectetur adipisicing elit. A alias consequatur deserunt doloribus facilis, ipsum nisi nulla quam rem totam!
- Lorem ipsum dolor sit amet, consectetur adipisicing elit. A alias consequatur deserunt doloribus facilis, ipsum nisi nulla quam rem totam!
- </p>
+ {% chunk 'donation-data-processing' %}
</div>
<button class="l-article__read-more" aria-label="Kliknij aby rozwinÄ
Ä" data-label="WiÄcej" data-action="Mniej">WiÄcej</button>
</div>
@@ -114,10 +102,7 @@
<h3>FAQ</h3>
<div>
<div class="l-article__overlay" data-max-height="91">
- <p>
- Chcesz zmieniÄ wysokoÅÄ darowizny, anulowaÄ przyszÅe pÅatnoÅci lub masz inne pytania? Tu znajdziesz odpowiedzi na nie:
- <a href="#">Pytania i odpowiedzi dotyczÄ
ce pÅatnoÅci</a>.
- </p>
+ {% chunk 'donation-faq' %}
</div>
</div>
</div>
diff --git a/src/wolnelektury/settings/static.py b/src/wolnelektury/settings/static.py
index 2469532d9..a1e53186d 100644
--- a/src/wolnelektury/settings/static.py
+++ b/src/wolnelektury/settings/static.py
@@ -27,6 +27,7 @@ PIPELINE = {
'contrib/jquery-ui-1.13.1.custom/jquery-ui.css',
'2022/styles/main.scss',
'2022/more.scss',
+ 'chunks/edit.scss',
],
'output_filename': 'css/compressed/2022.css',
},
@@ -141,6 +142,7 @@ PIPELINE = {
'js/search.js',
'js/2022.js',
'2022/book/filter.js',
+ 'chunks/edit.js',
],
'output_filename': 'js/2022.min.js'
},
diff --git a/src/wolnelektury/static/2022/images/korona.svg b/src/wolnelektury/static/2022/images/korona.svg
new file mode 100644
index 000000000..a53b60b7e
--- /dev/null
+++ b/src/wolnelektury/static/2022/images/korona.svg
@@ -0,0 +1,3 @@
+<svg width="21" height="17" viewBox="0 0 21 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20.7882 11.4369L3.63295 16.8863L0.26238 6.27546L5.02327 8.05076L8.57764 2.72475L14.554 5.02331L17.2865 0.413034L20.7882 11.4369Z" fill="#FBC40F"/>
+</svg>
diff --git a/src/wolnelektury/static/2022/more.scss b/src/wolnelektury/static/2022/more.scss
index dadf44990..9d7cf2199 100644
--- a/src/wolnelektury/static/2022/more.scss
+++ b/src/wolnelektury/static/2022/more.scss
@@ -12,16 +12,59 @@ body.is-open {
padding: 10px 50px;
}
-.l-navigation {
- //opacity: .5;
-}
-
.l-navigation__logo {
height: 44px;
}
.l-navigation__menu {
- overflow-y: scroll;
+ .scrollable {
+ height: 100%;
+ overflow-y: scroll;
+ padding-bottom: 30px;
+ }
+}
+
+.l-navigation__menu__book__header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ p {
+ margin: 0;
+
+ &.korona {
+ &:before {
+ content: url('images/korona.svg');
+ width: 21px;
+ margin-right: -21px;
+ position: relative;
+ top: -10px;
+ left: -3px;
+ }
+ }
+ }
+}
+.l-navigation__menu__book {
+ .button {
+ display: inline-block;
+ font-size: 16px;
+ font-weight: 700;
+ padding: 0 20px;
+ min-width: 212px;
+ line-height: 38px;
+ text-align: center;
+
+ /* green 700 */
+ background: #92BD39;
+ color: #083F4D;
+ border-radius: 6px;
+
+ transition: background-color 150ms;
+
+ &:hover {
+ background-color: #FBC40F;
+ }
+ }
}
.l-navigation__menu__book__info {
img {
@@ -29,6 +72,11 @@ body.is-open {
height: 60px;
}
}
+.l-navigation__menu__links ul li a em {
+ font-style: normal;
+ color: #FFA500;
+ font-weight: 600;
+}
.l-navigation__login {
color: #74BDC2;
margin-right: 20px;
@@ -85,6 +133,9 @@ body.is-open {
}
}
+.l-checkout__box {
+ position: relative;
+}
.l-checkout__payments {
display: none;
diff --git a/src/wolnelektury/templates/2022/header.html b/src/wolnelektury/templates/2022/header.html
index b7d7a3324..47db25d67 100644
--- a/src/wolnelektury/templates/2022/header.html
+++ b/src/wolnelektury/templates/2022/header.html
@@ -28,6 +28,7 @@
</li>
{% if request.user.is_staff %}
<li><a href="{% url 'admin:index' %}" tabindex="-1">Administracja</a></li>
+ <li><a class='edit-links-toggle' href="#" tabindex="-1">Edycja</a></li>
{% endif %}
<li><a href="{% url 'logout' %}?next={% block logout %}{{ request.get_full_path }}{% endblock %}" tabindex="-1">Wyloguj siÄ</a></li>
</ul>
@@ -55,70 +56,70 @@
</button>
</div>
<div class="l-navigation__menu">
- <div class="l-container">
- <div class="l-navigation__menu__links">
- {% cache 30 menu LANGUAGE_CODE %}
- <ul>
- <li><strong>Katalog</strong></li>
- {% menu 'Katalog' %}
- </ul>
- <ul>
- <li><strong>WÅÄ
cz siÄ</strong></li>
- {% menu 'WÅÄ
cz siÄ' %}
- </ul>
- <ul>
- <li><strong>AktualnoÅci</strong></li>
- {% latest_blog_posts %}
- {% menu 'AktualnoÅci' %}
- </ul>
- <ul>
- <li><strong>NarzÄdzia</strong></li>
- {% menu 'NarzÄdzia' %}
- </ul>
- <ul>
- <li><strong>O nas</strong></li>
- {% menu 'O nas' %}
- </ul>
- {% endcache %}
- </div>
+ <div class="scrollable">
+ <div class="l-container">
+ <div class="l-navigation__menu__links">
+ {% cache 30 menu LANGUAGE_CODE %}
+ <ul>
+ <li><strong>Katalog</strong></li>
+ {% menu 'Katalog' %}
+ </ul>
+ <ul>
+ <li><strong>WÅÄ
cz siÄ</strong></li>
+ {% menu 'WÅÄ
cz siÄ' %}
+ </ul>
+ <ul>
+ <li><strong>AktualnoÅci</strong></li>
+ {% latest_blog_posts %}
+ {% menu 'AktualnoÅci' %}
+ </ul>
+ <ul>
+ <li><strong>NarzÄdzia</strong></li>
+ {% menu 'NarzÄdzia' %}
+ </ul>
+ <ul>
+ <li><strong>O nas</strong></li>
+ {% menu 'O nas' %}
+ </ul>
+ {% endcache %}
+ </div>
- <div class="l-navigation__menu__info">
+ <div class="l-navigation__menu__info">
- <div class="l-navigation__menu__book">
- {% cache 300 preview_ad LANGUAGE_CODE %}
+ <div class="l-navigation__menu__book">
{% preview_ad %}
- {% endcache %}
- </div>
+ </div>
- <div class="l-navigation__menu__social">
- <ul>
- <li>
- <a href="https://www.facebook.com/wolnelektury/"
- title="Facebook" tabindex="-1" target="_blank">
- <i class="icon icon-fb" aria-hidden="true"></i>
- </a>
- </li>
- <li>
- <a href="https://www.youtube.com/c/WolneLekturyYT/"
- title="YouTube" tabindex="-1" target="_blank">
- <i class="icon icon-yt" aria-hidden="true"></i>
- </a>
- </li>
- <li>
- <a href="https://www.instagram.com/wolnelektury/"
- title="Instagram" tabindex="-1" target="_blank">
- <i class="icon icon-ig" aria-hidden="true"></i>
- </a>
- </li>
- <li>
- <a href="https://twitter.com/wolnelektury"
- title="Twitter" tabindex="-1" target="_blank">
- <i class="icon icon-tt" aria-hidden="true"></i>
- </a>
+ <div class="l-navigation__menu__social">
+ <ul>
+ <li>
+ <a href="https://www.facebook.com/wolnelektury/"
+ title="Facebook" tabindex="-1" target="_blank">
+ <i class="icon icon-fb" aria-hidden="true"></i>
+ </a>
+ </li>
+ <li>
+ <a href="https://www.youtube.com/c/WolneLekturyYT/"
+ title="YouTube" tabindex="-1" target="_blank">
+ <i class="icon icon-yt" aria-hidden="true"></i>
+ </a>
+ </li>
+ <li>
+ <a href="https://www.instagram.com/wolnelektury/"
+ title="Instagram" tabindex="-1" target="_blank">
+ <i class="icon icon-ig" aria-hidden="true"></i>
+ </a>
+ </li>
+ <li>
+ <a href="https://twitter.com/wolnelektury"
+ title="Twitter" tabindex="-1" target="_blank">
+ <i class="icon icon-tt" aria-hidden="true"></i>
+ </a>
</li>
</ul>
</div>
</div>
+ </div>
</div>
</div>
</div>
--
2.20.1