diff --git a/district/migrations/0127_alter_districthomepage_menu.py b/district/migrations/0127_alter_districthomepage_menu.py
new file mode 100644
index 0000000000000000000000000000000000000000..4d954be5548502e4b49a641f619ef44a2e285068
--- /dev/null
+++ b/district/migrations/0127_alter_districthomepage_menu.py
@@ -0,0 +1,20 @@
+# Generated by Django 4.1.10 on 2024-02-10 15:31
+
+from django.db import migrations
+import wagtail.blocks
+import wagtail.fields
+
+
+class Migration(migrations.Migration):
+
+ dependencies = [
+ ('district', '0126_districtpdfpage'),
+ ]
+
+ operations = [
+ migrations.AlterField(
+ model_name='districthomepage',
+ name='menu',
+ field=wagtail.fields.StreamField([('menu_item', wagtail.blocks.StructBlock([('title', wagtail.blocks.CharBlock(label='Titulek', required=True)), ('page', wagtail.blocks.PageChooserBlock(label='Stránka', required=False)), ('link', wagtail.blocks.URLBlock(label='Odkaz', required=False))])), ('menu_parent', wagtail.blocks.StructBlock([('title', wagtail.blocks.CharBlock(label='Titulek', required=True)), ('menu_items', wagtail.blocks.ListBlock(wagtail.blocks.StructBlock([('title', wagtail.blocks.CharBlock(label='Titulek', required=True)), ('page', wagtail.blocks.PageChooserBlock(label='Stránka', required=False)), ('link', wagtail.blocks.URLBlock(label='Odkaz', required=False))]), label='Položky menu'))]))], blank=True, use_json_field=True, verbose_name='Menu'),
+ ),
+ ]
diff --git a/donate/menu.py b/donate/menu.py
index a97b73de493fbca38a12785a1d9b326e64d33dd4..6d23705943851d11ccf40146d4ebba3f1e9815fd 100644
--- a/donate/menu.py
+++ b/donate/menu.py
@@ -1,6 +1,7 @@
from wagtail.fields import StreamField
from shared.blocks import MenuItemBlock as MenuItemBlockBase
+from shared.blocks import MenuParentBlock
from shared.models import MenuMixin as MenuMixinBase
@@ -20,7 +21,10 @@ class MenuItemBlock(MenuItemBlockBase):
class MenuMixin(MenuMixinBase):
menu = StreamField(
- [("menu_item", MenuItemBlock())], # , ("menu_parent", MenuParentBlock())
+ [
+ ("menu_item", MenuItemBlock()),
+ ("menu_parent", MenuParentBlock(template="donate/blocks/navbar_submenu.html")),
+ ], # , ("menu_parent", MenuParentBlock())
verbose_name="Menu",
blank=True,
use_json_field=True,
diff --git a/donate/migrations/0044_alter_donatehomepage_menu.py b/donate/migrations/0044_alter_donatehomepage_menu.py
new file mode 100644
index 0000000000000000000000000000000000000000..72bcf44a3fc8c88aec952d2aee06d6fa618a4d79
--- /dev/null
+++ b/donate/migrations/0044_alter_donatehomepage_menu.py
@@ -0,0 +1,20 @@
+# Generated by Django 4.1.10 on 2024-02-10 15:52
+
+from django.db import migrations
+import wagtail.blocks
+import wagtail.fields
+
+
+class Migration(migrations.Migration):
+
+ dependencies = [
+ ('donate', '0043_alter_donateprojectpage_form_title'),
+ ]
+
+ operations = [
+ migrations.AlterField(
+ model_name='donatehomepage',
+ name='menu',
+ field=wagtail.fields.StreamField([('menu_item', wagtail.blocks.StructBlock([('title', wagtail.blocks.CharBlock(label='Titulek', required=True)), ('page', wagtail.blocks.PageChooserBlock(label='Stránka', required=False)), ('link', wagtail.blocks.URLBlock(label='Odkaz', required=False))])), ('menu_parent', wagtail.blocks.StructBlock([('title', wagtail.blocks.CharBlock(label='Titulek', required=True)), ('menu_items', wagtail.blocks.ListBlock(wagtail.blocks.StructBlock([('title', wagtail.blocks.CharBlock(label='Titulek', required=True)), ('page', wagtail.blocks.PageChooserBlock(label='Stránka', required=False)), ('link', wagtail.blocks.URLBlock(label='Odkaz', required=False))]), label='Položky menu'))]))], blank=True, use_json_field=True, verbose_name='Menu'),
+ ),
+ ]
diff --git a/donate/static/donate/assets/css/icons.css b/donate/static/donate/assets/css/icons.css
index 44a556a96b807a39dfb9a21234c755cffaae6e64..ebb8d5d56101cc37835c91a589382a602607c93d 100644
--- a/donate/static/donate/assets/css/icons.css
+++ b/donate/static/donate/assets/css/icons.css
@@ -55,6 +55,9 @@ i[class^="icon"] {
.icon-chevron-right:before {
content: "\f054";
}
+.icon-chevron-down:before {
+ content: "\e925";
+}
.icon-external-link:before {
content: "\f08e";
}
diff --git a/donate/static/donate/assets/css/style.css b/donate/static/donate/assets/css/style.css
index 4a6b97479cdbf3c9393b8f9a3de9164947c1facd..6e893c331114cf07844bd5012479f2ab9bc489ac 100644
--- a/donate/static/donate/assets/css/style.css
+++ b/donate/static/donate/assets/css/style.css
@@ -1279,3 +1279,65 @@ img.full-width {
}
/* END TailwindCSS-based image formatting */
+
+/* The container <div> - needed to position the dropdown content */
+.dropdown {
+ position: relative;
+ cursor: pointer;
+}
+
+/* Dropdown Content (Hidden by Default) */
+.dropdown-content {
+ display: none;
+ position: absolute;
+ z-index: 1;
+}
+
+@media screen and (max-width: 1200px) {
+ .dropdown-content {
+ display: block;
+ position: unset;
+ }
+}
+
+@media screen and (max-width: 1200px) {
+ .dropbtn {
+ display: none;
+ }
+}
+
+/* Links inside the dropdown */
+.dropdown-content a {
+ display: block;
+ color: white;
+}
+
+@media screen and (min-width: 1200px) {
+ /* Show the dropdown menu on hover */
+ .dropdown:hover .dropdown-content,
+ .dropdown:focus .dropdown-content{
+ display: block;
+ background: black;
+ padding: 0.8rem;
+ margin-left: -0.8rem;
+ width: 100%;
+ }
+
+ .dropdown:hover,
+ .dropdown:focus {
+ background: black
+ }
+}
+
+.drop-arrow {
+ margin-left: 2px;
+ color: #8a8a8a;
+ position: relative;
+ top: -3px;
+}
+
+@media screen and (max-width: 1200px) {
+ .drop-arrow {
+ display: none;
+ }
+}
diff --git a/donate/templates/donate/blocks/navbar_submenu.html b/donate/templates/donate/blocks/navbar_submenu.html
new file mode 100644
index 0000000000000000000000000000000000000000..9b138e4f8a2ca04723206a31445933be1cd46d95
--- /dev/null
+++ b/donate/templates/donate/blocks/navbar_submenu.html
@@ -0,0 +1,21 @@
+<div
+ class="dropdown nav-link js-scroll-anchor"
+ tabindex="0"
+>
+ <div class="dropbtn">
+ {{ self.title }}
+
+ <span class="drop-arrow">🞃</span>
+ </div>
+
+ <div class="dropdown-content">
+ {% for nested_item in self.menu_items %}
+ <li>
+ {% firstof nested_item.page.url nested_item.link as target %}
+ <a href="{{ target }}">
+ {{ nested_item.title }}
+ </a>
+ </li>
+ {% endfor %}
+ </div>
+</div>
diff --git a/donate/templates/donate/donate_home_page.html b/donate/templates/donate/donate_home_page.html
index d96ce5bb33295b64968d23e97e7ca4aa19e9e02c..9297cf2e55928ab1d3eff1929d376d4c3b74a06e 100644
--- a/donate/templates/donate/donate_home_page.html
+++ b/donate/templates/donate/donate_home_page.html
@@ -9,6 +9,17 @@
<div class="container">
<div class="row align-items-center">
+ <div class="col-12 col-lg-5">
+ {% image page.lead_preview width-500 as lead_preview %}
+ {% if page.lead_video %}
+ <a data-fancybox="" href="{{ page.lead_video }}" title="Přehrát video">
+ <img class="img-fluid lazyload w-100" data-src="{{ lead_preview.url }}" alt="Náhled videa">
+ </a>
+ {% else %}
+ <img class="img-fluid lazyload" data-src="{{ lead_preview.url }}" alt="Náhled videa">
+ {% endif %}
+ </div><!-- /column -->
+
<div class="col-12 col-lg-7 mb-4 mb-lg-0 py-4 text-md-left">
<h1 class="lead homepage-heading">{{ page.lead_title }}</h1>
<div class="lead lead-small mb-4">{{ page.lead_body|richtext }}</div>
@@ -22,17 +33,6 @@
</div> <!-- /row -->
</div><!-- /column -->
- <div class="col-12 col-lg-5">
- {% image page.lead_preview width-500 as lead_preview %}
- {% if page.lead_video %}
- <a data-fancybox="" href="{{ page.lead_video }}" title="Přehrát video">
- <img class="img-fluid lazyload w-100" data-src="{{ lead_preview.url }}" alt="Náhled videa">
- </a>
- {% else %}
- <img class="img-fluid lazyload" data-src="{{ lead_preview.url }}" alt="Náhled videa">
- {% endif %}
- </div><!-- /column -->
-
</div> <!-- /row -->
</div> <!-- /container -->
</section>
diff --git a/shared/blocks/base.py b/shared/blocks/base.py
index 28d98856e30b4eb07be62a6d48097b47f2fddacd..f109f938455be7b8e5f71456423a7a88462a72a5 100644
--- a/shared/blocks/base.py
+++ b/shared/blocks/base.py
@@ -74,9 +74,7 @@ class MenuItemBlock(blocks.StructBlock):
class MenuParentBlock(blocks.StructBlock):
title = blocks.CharBlock(label="Titulek", required=True)
- menu_items = blocks.ListBlock(
- MenuItemBlock(),
- )
+ menu_items = blocks.ListBlock(MenuItemBlock(), label="Položky menu")
class Meta:
label = "Podmenu"