From 60bc0b37170dddb5b7555e43e42a429d6ba3504c Mon Sep 17 00:00:00 2001
From: Ondrej Rehounek <ondra.rehounek@seznam.cz>
Date: Wed, 24 Aug 2022 07:22:44 +0200
Subject: [PATCH] main: newsletter and hp boxes sections
---
main/blocks.py | 3 ++
main/templates/main/blocks/boxes_block.html | 26 +++++++++++++++
.../main/includes/button_animated.html | 2 +-
.../main/includes/newsletter_section.html | 33 +++++++++++++++++++
main/templates/main/main_home_page.html | 2 ++
5 files changed, 65 insertions(+), 1 deletion(-)
create mode 100644 main/templates/main/blocks/boxes_block.html
create mode 100644 main/templates/main/includes/newsletter_section.html
diff --git a/main/blocks.py b/main/blocks.py
index a18500ab..09df2b2b 100644
--- a/main/blocks.py
+++ b/main/blocks.py
@@ -23,6 +23,9 @@ class BoxesBlock(StructBlock):
title = CharBlock(label="Nadpis")
list = ListBlock(BoxBlock, label="Boxíky")
+ class Meta:
+ template = "main/blocks/boxes_block.html"
+
class HomePageCarouseSlideBlock(CTAMixin, StructBlock):
image = ImageChooserBlock(label="Hlavní obrázek jednoho slidu carouselu")
diff --git a/main/templates/main/blocks/boxes_block.html b/main/templates/main/blocks/boxes_block.html
new file mode 100644
index 00000000..c265ee71
--- /dev/null
+++ b/main/templates/main/blocks/boxes_block.html
@@ -0,0 +1,26 @@
+{% load wagtailimages_tags %}
+
+<div class="bg-cover bg-no-repeat section-clip py-16 lg:py-36"
+ style="background-image: url('https://i.picsum.photos/id/630/1980/1400.jpg?hmac=WjDo021fzd9SaIlmsi9LtZJApZ02RMzdG0bYLx8iXOo')">
+ <div class="container--medium">
+ <h2 class="head-7xl text-center mb-6 xl:mb-28">
+ {{ self.title }}
+ </h2>
+ <div class="flex flex-wrap justify-center items-center">
+ {% for box in self.list %}
+ <div class="mb-1 w-60 w-80 h-80 flex bg-white flex-col items-center justify-center md:mr-1">
+ {% image box.image max-200x200 as box_img %}
+ <img
+ src="{{ box_img.url }}"
+ alt=""
+ class="mb-8"
+ >
+ <h5 class="head-4xl mb-8">
+ {{ box.title }}
+ </h5>
+ {% include 'main/includes/button_animated.html' with btn_link=box.button_link btn_text=box.button_text %}
+ </div>
+ {% endfor %}
+ </div>
+ </div>
+</div>
diff --git a/main/templates/main/includes/button_animated.html b/main/templates/main/includes/button_animated.html
index 34c0802c..62462cfc 100644
--- a/main/templates/main/includes/button_animated.html
+++ b/main/templates/main/includes/button_animated.html
@@ -1,4 +1,4 @@
-<a href="" class="btn btn__slide__wrap {{ extra_classes }}">
+<a href="{{ btn_link }}" class="btn btn__slide__wrap {{ extra_classes }}">
<span class="btn text-sm bg-black text-white w-32 lg:text-base">
{{ btn_text | default_if_none:"Číst dále" }}
</span>
diff --git a/main/templates/main/includes/newsletter_section.html b/main/templates/main/includes/newsletter_section.html
new file mode 100644
index 00000000..ff79b651
--- /dev/null
+++ b/main/templates/main/includes/newsletter_section.html
@@ -0,0 +1,33 @@
+<div class="section-clip bg-cover bg-no-repeat flex py-16 lg:py-36"
+ style="background-image: url('https://images.pexels.com/photos/3073681/pexels-photo-3073681.jpeg')">
+ <div class="grid-container items-center px-4">
+ <div class="grid-full flex flex-col">
+ <div class="flex space-x-3 mb-4">
+ <i class="ico--anchor text-7xl xl:text-9xl mb-4 xl:w-1/4"></i>
+ <h5 class="uppercase mt-4 head-alt-md xl:head-alt-lg">Odebírej náš <br> newsletter</h5>
+ </div>
+ <div class="flex xl:space-x-3 flex-wrap flex-col xl:flex-row">
+ <span class="uppercase text-sm xl:text-base font-bold mb-2 xl:w-1/4">
+ Fake news tam nenajdeš, ale dozvíš se co chystáme doopravdy!
+ </span>
+ <div class="">
+ <input
+ type="text"
+ class="text-input form-field__control mb-3 w-full"
+ value=""
+ placeholder="Tvůj email"
+ />
+
+ <div class="checkbox form-field__control mb-3">
+ <input type="checkbox" id="agreement_checkbox">
+ <label class="text-xs font-bold" for="agreement_checkbox">
+ Souhlasím se zpracováním osobních údajů
+ </label>
+ </div>
+
+ {% include 'main/includes/button_animated.html' with btn_link=box.button_link btn_text="Odebírat" %}
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
diff --git a/main/templates/main/main_home_page.html b/main/templates/main/main_home_page.html
index 7004c81b..06e1bb0d 100644
--- a/main/templates/main/main_home_page.html
+++ b/main/templates/main/main_home_page.html
@@ -6,5 +6,7 @@
{% for block in page.content %}
{% include_block block %}
{% endfor %}
+
+ {% include "main/includes/newsletter_section.html" %} {# TODO boxy cheme pod (dvě sekce contentu nebo ify) #}
</main>
{% endblock %}
--
GitLab