diff --git a/.isort.cfg b/.isort.cfg
index 642718cfd97d7944a4ae8bd5026564016495dc25..340422d3f105d7b81db8953287dfc01b98d2ff0f 100644
--- a/.isort.cfg
+++ b/.isort.cfg
@@ -3,4 +3,4 @@
line_length = 88
multi_line_output = 3
include_trailing_comma = true
-known_third_party = PyPDF2,arrow,bleach,bs4,captcha,celery,django,environ,faker,fastjsonschema,icalevnt,markdown,modelcluster,pirates,pytest,pytz,requests,sentry_sdk,taggit,tweepy,wagtail,wagtailmetadata,weasyprint,yaml,zoneinfo
+known_third_party = PyPDF2,arrow,bleach,bs4,captcha,celery,django,environ,faker,fastjsonschema,icalevnt,markdown,modelcluster,pirates,pytest,pytz,requests,sentry_sdk,taggit,tweepy,wagtail,wagtailmetadata,weasyprint,yaml
diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml
index 547e2ea187886ee2bc24f932602f357002552d85..1284056307733585d4096e0c762fa519df04bca4 100644
--- a/.pre-commit-config.yaml
+++ b/.pre-commit-config.yaml
@@ -1,5 +1,5 @@
default_language_version:
- python: python3.8
+ python: python3.9
exclude: snapshots/
repos:
diff --git a/main/models.py b/main/models.py
index a02fb785fb493ea6f037e07bf39ae72e74f95ca8..afc6da4e5fa2e3df45484183af9c02d6c9b8ea10 100644
--- a/main/models.py
+++ b/main/models.py
@@ -180,39 +180,41 @@ class MainHomePage(MenuMixin, ExtendedMetadataHomePageMixin, MetadataPageMixin,
def get_region_response(self, request):
last_month = timezone.now().today().replace(day=1) - timedelta(days=1)
first_day_of_last_month = last_month.replace(day=1)
- if request.GET.get('region', None) == 'VSK':
+ if request.GET.get("region", None) == "VSK":
sorted_article_qs = MainArticlePage.objects.filter(
date__gt=first_day_of_last_month
).order_by("-date")
else:
sorted_article_qs = MainArticlePage.objects.filter(
- date__gt=first_day_of_last_month, region=request.GET.get('region', None)
+ date__gt=first_day_of_last_month, region=request.GET.get("region", None)
).order_by("-date")
- context = {
- "article_data_list": sorted_article_qs[:3]
- }
+ context = {"article_data_list": sorted_article_qs[:3]}
data = {
- 'html': render(request, 'main/includes/small_article_preview.html', context).content.decode("utf-8")
+ "html": render(
+ request, "main/includes/small_article_preview.html", context
+ ).content.decode("utf-8")
}
return JsonResponse(data=data, safe=False)
def get_twitter_response(self, request):
- tweet_paginator = Paginator(Tweet.objects.order_by("-twitter_id"), self.max_items)
- tweet_page = tweet_paginator.get_page(request.GET.get('page', 1))
- context = {
- "tweet_list": tweet_page.object_list
- }
- html_content = render(request, 'main/includes/twitter_widget.html', context).content
+ tweet_paginator = Paginator(
+ Tweet.objects.order_by("-twitter_id"), self.max_items
+ )
+ tweet_page = tweet_paginator.get_page(request.GET.get("page", 1))
+ context = {"tweet_list": tweet_page.object_list}
+ html_content = render(
+ request, "main/includes/twitter_widget.html", context
+ ).content
data = {
- 'html': html_content.decode("utf-8"),
- 'last_page': tweet_page.paginator.num_pages,
+ "html": html_content.decode("utf-8"),
+ "last_page": tweet_page.paginator.num_pages,
}
return JsonResponse(data=data, safe=False)
def serve(self, request, *args, **kwargs):
- if not request.META.get('HTTP_X_REQUESTED_WITH') == 'XMLHttpRequest':
+ if not request.META.get("HTTP_X_REQUESTED_WITH") == "XMLHttpRequest":
return super().serve(request, *args, **kwargs)
- if 'region' in request.GET:
+ if "region" in request.GET:
return self.get_region_response(request)
else:
return self.get_twitter_response(request)
@@ -310,7 +312,7 @@ class MainArticlesPage(
first_day_of_last_month = last_month.replace(day=1)
sorted_article_qs = MainArticlePage.objects.filter(
- date__gt=first_day_of_last_month
+ date__gt=first_day_of_last_month, article_type=ARTICLE_TYPES.WORK_TIMELINE
).order_by("-date")
article_data_list = []
@@ -334,26 +336,56 @@ class MainArticlesPage(
def get_context(self, request, *args, **kwargs):
ctx = super().get_context(request, args, kwargs)
- article_list = self.get_article_data_list(1)
- ctx["article_data_list"] = article_list
- ctx["show_next_articles"] = MainArticlePage.objects.count() > len(article_list)
+ article_timeline_list = self.get_article_data_list(1)
+ ctx["article_timeline_list"] = article_timeline_list
+ ctx["show_next_timeline_articles"] = MainArticlePage.objects.filter(
+ article_type=ARTICLE_TYPES.WORK_TIMELINE
+ ).count() > len(article_timeline_list)
+ article_list = MainArticlePage.objects.filter(
+ article_type=ARTICLE_TYPES.PRESS_RELEASE
+ ).order_by("-date")
+ ctx["article_article_list"] = article_list[:10]
+ ctx["show_next_article"] = len(article_list) > 4
return ctx
- def get_articles_response(self, request):
- article_list = self.get_article_data_list(int(request.GET.get('months', None)))
- context = {
- "article_data_list": article_list
+ def get_timeline_articles_response(self, request):
+ article_list = self.get_article_data_list(int(request.GET.get("months", None)))
+ context = {"article_data_list": article_list}
+ data = {
+ "html": render(
+ request, "main/blocks/articles_timeline_block.html", context
+ ).content.decode("utf-8"),
+ "last_article": article_list[-1]
+ == MainArticlePage.objects.filter(article_type=ARTICLE_TYPES.WORK_TIMELINE)
+ .order_by("-date")
+ .last(),
}
+ return JsonResponse(data=data, safe=False)
+
+ def get_articles_response(self, request):
+ article_paginator = Paginator(
+ MainArticlePage.objects.filter(
+ article_type=ARTICLE_TYPES.PRESS_RELEASE
+ ).order_by("-date", "title"),
+ 10,
+ )
+ article_page = article_paginator.get_page(request.GET.get("page", 1))
+ context = {"article_data_list": article_page.object_list}
+ html_content = render(
+ request, "main/includes/person_article_preview.html", context
+ ).content
data = {
- 'html': render(request, 'main/blocks/articles_block.html', context).content.decode("utf-8"),
- 'last_article': article_list[-1] == MainArticlePage.objects.all().order_by('-date').last()
+ "html": html_content.decode("utf-8"),
+ "last_page": article_page.paginator.num_pages,
}
return JsonResponse(data=data, safe=False)
def serve(self, request, *args, **kwargs):
- if not request.META.get('HTTP_X_REQUESTED_WITH') == 'XMLHttpRequest':
+ if not request.META.get("HTTP_X_REQUESTED_WITH") == "XMLHttpRequest":
return super().serve(request, *args, **kwargs)
- if 'months' in request.GET:
+ if "months" in request.GET:
+ return self.get_timeline_articles_response(request)
+ if "page" in request.GET:
return self.get_articles_response(request)
@staticmethod
@@ -507,7 +539,7 @@ class MainPersonPage(ExtendedMetadataPageMixin, SubpageMixin, MetadataPageMixin,
blank=True,
null=True,
verbose_name="Hlavní obrázek",
- related_name="+"
+ related_name="+",
)
profile_image = models.ForeignKey(
@@ -516,7 +548,7 @@ class MainPersonPage(ExtendedMetadataPageMixin, SubpageMixin, MetadataPageMixin,
blank=True,
null=True,
verbose_name="Profilový obrázek",
- related_name="+"
+ related_name="+",
)
before_name = models.CharField(
"Tituly před jménem", max_length=32, blank=True, null=True
@@ -535,7 +567,7 @@ class MainPersonPage(ExtendedMetadataPageMixin, SubpageMixin, MetadataPageMixin,
blank=True,
null=True,
max_length=32,
- help_text="Uživatelské jméno zadejte bez @ na začátku"
+ help_text="Uživatelské jméno zadejte bez @ na začátku",
)
social_links = StreamField(
@@ -622,7 +654,7 @@ class MainContactPage(ExtendedMetadataPageMixin, SubpageMixin, MetadataPageMixin
text = StreamField(
[("two_columns_text", blocks.TwoTextColumnBlock())],
verbose_name="Kontaktní informace",
- blank=True
+ blank=True,
)
### PANELS
diff --git a/main/styleguide/source/_patterns/atoms/form-fields/form-input.mustache b/main/styleguide/source/_patterns/atoms/form-fields/form-input.mustache
index d6e09736790c6df208e7e2c5cd3826aa8b6c6790..4b31e175c3af463ca822c773d987612e99391bf3 100644
--- a/main/styleguide/source/_patterns/atoms/form-fields/form-input.mustache
+++ b/main/styleguide/source/_patterns/atoms/form-fields/form-input.mustache
@@ -1 +1,2 @@
-<input type="text" class="text-input bg-white form-field__control {{ classes }}" value="" placeholder="{{ placeholder }}{{^ placeholder }}{{ form.placeholder }}{{/ placeholder }}" {{# disabled }}disabled{{/ disabled }} {{# readonly }}readonly{{/ readonly }} />
+<input type="text" class="text-input bg-white form-field__control {{ classes }}" value=""
+ placeholder="{{ placeholder }}{{^ placeholder }}{{ form.placeholder }}{{/ placeholder }}" {{# disabled }}disabled{{/ disabled }} {{# readonly }}readonly{{/ readonly }} />
diff --git a/main/styleguide/source/_patterns/molecules/articles/small-article-preview.mustache b/main/styleguide/source/_patterns/molecules/articles/small-article-preview.mustache
index 3e3cf7198edb98a5961a77597105c7bab541585c..59afe282c511f912127655436f99f8416108f877 100644
--- a/main/styleguide/source/_patterns/molecules/articles/small-article-preview.mustache
+++ b/main/styleguide/source/_patterns/molecules/articles/small-article-preview.mustache
@@ -5,7 +5,7 @@
class="mr-4 h-32 w-32"
>
<div class="flex flex-col justify-between items-start">
- <span class="text-sm text-green-500 lg:text-base mb-2">23.2.2022</span>
+ <span class="text-sm text-green-500 mb-2 lg:text-base">23.2.2022</span>
<h4 class="font-alt leading-5 text-base uppercase lg:text-base mb-2">
Komentář Lukáše Koláříka: Kriminalita ve virtuálním prostoru není imaginární,
ale skutečná. Jak nenaletět internetovým šmejdům?
diff --git a/main/styleguide/source/_patterns/molecules/twitter-box.mustache b/main/styleguide/source/_patterns/molecules/twitter-box.mustache
index 7a77ed3fab6a6b99d5ddf69acdb7ce6e754c587c..00a70a083d006f18bf767a61e54c6ade27765fd0 100644
--- a/main/styleguide/source/_patterns/molecules/twitter-box.mustache
+++ b/main/styleguide/source/_patterns/molecules/twitter-box.mustache
@@ -2,7 +2,7 @@
<div class="flex flex-row sm:flex-col items-center">
<img class="rounded-full shadow-sm w-12 h-12 mb-4 sm:mb-2" src="https://randomuser.me/api/portraits/women/56.jpg"
alt="user image"/>
- <div class="flex flex-col sm:sm:flex-col">
+ <div class="flex flex-col sm:flex-col">
<h5 class="font-alt text-xl mb-2 sm:text-base">Tomáš Marný</h5>
<small class="mb-4 text-turquoise-400">@pirat.tomas.marny</small>
</div>
diff --git a/main/styleguide/source/_patterns/templates/how-we-works.mustache b/main/styleguide/source/_patterns/templates/how-we-works.mustache
index 260330956e36a33618556b45bece29f0728c5b18..8a4c419e6db6d9917ea6f6742d101c561dfaa2ee 100644
--- a/main/styleguide/source/_patterns/templates/how-we-works.mustache
+++ b/main/styleguide/source/_patterns/templates/how-we-works.mustache
@@ -20,16 +20,18 @@
v-slot="{ isCurrentView, toggleView }">
<div class="grid-container article-section mb-8">
<div class="grid-full">
- <div class="switch">
- <a @click="toggleView('timeline')" class="switch__item"
- :class="{'switch__item--active': isCurrentView('timeline')}">Poslanecká sněmovna</a>
- <a @click="toggleView('articles')" class="switch__item"
- :class="{'switch__item--active': isCurrentView('articles')}">Vláda</a>
- </div>
+ <div class="flex justify-center">
+ <div class="switch">
+ <a @click="toggleView('timeline')" class="switch__item"
+ :class="{'switch__item--active': isCurrentView('timeline')}">Poslanecká sněmovna</a>
+ <a @click="toggleView('articles')" class="switch__item"
+ :class="{'switch__item--active': isCurrentView('articles')}">Vláda</a>
+ </div>
+ </div>
</div>
</div>
<template v-if="isCurrentView('timeline')">
- <div class="mt-20">
+ <div class="mt-10 md:mt-20">
{{> organisms-main-articles-timeline }}
</div>
</template>
diff --git a/main/styleguide/source/_patterns/templates/program.mustache b/main/styleguide/source/_patterns/templates/program.mustache
index 205c9eb806f5da396dc2de6a77f484d365b31293..a0275a412fed19060141b57aaa15d95b64b40210 100644
--- a/main/styleguide/source/_patterns/templates/program.mustache
+++ b/main/styleguide/source/_patterns/templates/program.mustache
@@ -14,23 +14,32 @@
</div>
<div class="">
<div class="__js-root">
- <ui-view-provider :initial="{candidates: true, program: false}" :sync-location="true" v-slot="{ isCurrentView, toggleView }">
- <div class="mb-12 container--medium">
- <div class="switch">
- <a @click="toggleView('candidates')" class="switch__item" :class="{'switch__item--active': isCurrentView('candidates')}">Komunální volby 2022</a>
- <a @click="toggleView('program')" class="switch__item" :class="{'switch__item--active': isCurrentView('program')}">Sněmovní volby 2021</a>
- </div>
- </div>
- <div>
- <template v-if="isCurrentView('candidates')">
- {{> molecules-icon-title-text-block(icon: "ico--book") }}
- {{> molecules-icon-title-text-block(icon: "ico--book") }}
- </template>
- <template v-if="isCurrentView('program')">
- {{> molecules-icon-title-text-block(icon: "ico--eye") }}
- </template>
- </div>
- </ui-view-provider>
+ <ui-view-provider :initial="{candidates: true, program: false}" :sync-location="true"
+ v-slot="{ isCurrentView, toggleView }">
+ <div class="mb-12 container--medium flex justify-start">
+ <ui-horizontal-scrollable>
+ <div class="switch">
+ <a @click="toggleView('candidates')" class="switch__item"
+ :class="{'switch__item--active': isCurrentView('candidates')}">Komunální volby 2022</a>
+ <a @click="toggleView('program')" class="switch__item"
+ :class="{'switch__item--active': isCurrentView('program')}">Sněmovní volby 2021</a>
+ <a @click="toggleView('program')" class="switch__item"
+ :class="{'switch__item--active': isCurrentView('program1')}">Sněmovní volby 2020</a>
+ <a @click="toggleView('program')" class="switch__item"
+ :class="{'switch__item--active': isCurrentView('program2')}">Sněmovní volby 2019</a>
+ </div>
+ </ui-horizontal-scrollable>
+ </div>
+ <div>
+ <template v-if="isCurrentView('candidates')">
+ {{> molecules-icon-title-text-block(icon: "ico--book") }}
+ {{> molecules-icon-title-text-block(icon: "ico--book") }}
+ </template>
+ <template v-if="isCurrentView('program')">
+ {{> molecules-icon-title-text-block(icon: "ico--eye") }}
+ </template>
+ </div>
+ </ui-view-provider>
</div>
</div>
</main>
diff --git a/main/styleguide/source/css/atoms/heading.pcss b/main/styleguide/source/css/atoms/heading.pcss
index 99b578fff84e0199d999362cdaef446fc9b9e0a9..611c7c509e285b75f8f00763044bd47327a346b6 100644
--- a/main/styleguide/source/css/atoms/heading.pcss
+++ b/main/styleguide/source/css/atoms/heading.pcss
@@ -174,6 +174,9 @@
@apply font-alt text-4xl font-medium tracking-tight uppercase xl:text-8xl;
}
+.head-9xl {
+ @apply font-alt text-5xl font-medium tracking-tight uppercase xl:text-8xl;
+}
p {
@apply text-sm leading-6 lg:text-base;
diff --git a/main/styleguide/source/css/molecules/switch.pcss b/main/styleguide/source/css/molecules/switch.pcss
index 85307c2176781beab58e9e4235baad99832a36b8..ab6befee9b2a58db12774158fb41eefb3731488d 100644
--- a/main/styleguide/source/css/molecules/switch.pcss
+++ b/main/styleguide/source/css/molecules/switch.pcss
@@ -1,5 +1,5 @@
.switch {
- @apply py-5 justify-center;
+ @apply py-5;
}
.switch__item {
diff --git a/main/templates/main/blocks/article_download_block.html b/main/templates/main/blocks/article_download_block.html
index 98af590da5e8f73dd69c088d3f816faf3db5ceb4..fcc2be01e628b4540e79f78ee24e565e9ae210e8 100644
--- a/main/templates/main/blocks/article_download_block.html
+++ b/main/templates/main/blocks/article_download_block.html
@@ -1,15 +1,15 @@
-<div class="grid-container px-4 mb-4 bg-grey-150 xl:mb-20">
- <div class="flex justify-start xl:justify-end grid-left-side">
- <i class="ico--download text-6xl mr-12 pt-5 pb-5"></i>
- </div>
- <div class="grid-content flex items-center flex-wrap gap-3">
- <div class="flex items-center bg-white p-3 h-11 mr-3">
- <span class="font-bold mr-1">Stáhnout soubor: </span>
- <span>{{ self.file }}</span>
- </div>
- <a href="{{ self.file.url }}" class="btn btn__slide__wrap h-11 p-0" download>
- <span class="btn text-sm bg-black text-white w-32 lg:text-base">Stáhnout</span>
- <span class="btn text-sm bg-white text-black w-32 lg:text-base">Stáhnout</span>
- </a>
+<div class="grid-container flex xl:grid mb-4 bg-grey-150 xl:mb-20 py-5">
+ <div class="flex justify-start xl:justify-end grid-left-side">
+ <i class="ico--download p-2 text-3xl md:text-4xl xl:text-7xl xl:mr-12"></i>
+ </div>
+ <div class="grid-content flex items-center flex-wrap gap-3">
+ <div class="flex items-center bg-white h-11 p-1 mr-3">
+ <span class="font-bold mr-1">Stáhnout soubor: </span>
+ <span>{{ self.file }}</span>
</div>
+ <a href="{{ self.file.url }}" class="btn btn__slide__wrap h-11 p-0" download>
+ <span class="btn text-lg bg-black text-white w-32 lg:text-base">Stáhnout</span>
+ <span class="btn text-lg bg-white text-black w-32 lg:text-base">Stáhnout</span>
+ </a>
+ </div>
</div>
\ No newline at end of file
diff --git a/main/templates/main/blocks/article_image_block.html b/main/templates/main/blocks/article_image_block.html
index 049bfc560d3a346baeae622fcdcb67c2a8c4307b..6c19f20ae8f527733c2018ca9af47614f70a8e50 100644
--- a/main/templates/main/blocks/article_image_block.html
+++ b/main/templates/main/blocks/article_image_block.html
@@ -1,15 +1,15 @@
{% load wagtailimages_tags %}
-<div class="grid-container px-3 pt-3 mb-4 bg-grey-150 xl:pt-0 xl:mb-20">
+<div class="grid-container px-3 py-3 mb-4 bg-grey-150 xl:py-0 xl:mb-20">
<div class="grid-content-with-right-side flex flex-wrap gap-3 xl:gap-5">
{% image self.image max-500x500 as image %}
<img src="{{ image.url }}"
alt="" class="w-full max-w-sm">
<div class="flex flex-col justify-between">
- <a href="{{ self.href }}" class="mt-0 xl:mt-8 mb-2 font-bold hover:no-underline leading-5">
+ <a href="{{ self.href }}" class="mt-4 xl:mt-8 mb-2 font-bold hover:no-underline leading-5">
{{ self.text }}
</a>
- <span class="text-sm text-grey-200 uppercase mb-0 xl:mb-6">zdroj: {{ self.href }}</span>
+ <span class="text-sm text-grey-200 uppercase mb-4 xl:mb-6">zdroj: {{ self.href }}</span>
</div>
</div>
</div>
\ No newline at end of file
diff --git a/main/templates/main/blocks/article_quote_block.html b/main/templates/main/blocks/article_quote_block.html
index ac0211dc6521b97defd09202c892ffed9d20af06..fef74e01df5f1f47fd35fe92a45d505ec8719a1d 100644
--- a/main/templates/main/blocks/article_quote_block.html
+++ b/main/templates/main/blocks/article_quote_block.html
@@ -1,9 +1,9 @@
-<div class="grid-container px-4 mb-4 bg-grey-150 pt-10 lg:mb-20">
- <div class="grid-left-side flex justify-start xl:justify-end">
- <i class="ico--code text-7xl mr-12"></i>
- </div>
+<div class="grid-container flex xl:grid mb-4 bg-grey-150 xl:mb-20 py-5">
+ <div class="grid-left-side flex lg:justify-end">
+ <span class="quote-icon p-2 xl:mr-12 font-alt">”</span>
+ </div>
<div class="flex flex-col grid-content">
- <span class="head-4xl">{{ self.quote }}</span>
+ <span class="text-3xl head-4xl xl:text-4xl">{{ self.quote }}</span>
<span class="font-alt text-turquoise-500 mb-6">– {{ self.autor_name }}</span>
</div>
</div>
\ No newline at end of file
diff --git a/main/templates/main/blocks/articles_block.html b/main/templates/main/blocks/articles_block.html
deleted file mode 100644
index 0946fd767187bffa672df29961311a1cb06cf00b..0000000000000000000000000000000000000000
--- a/main/templates/main/blocks/articles_block.html
+++ /dev/null
@@ -1,28 +0,0 @@
-{% for month_article_data in article_data_list %}
- <div class="mb-4">
- <h3 class="head-7xl mb-4 xl:hidden">
- {{ month_article_data.month_text }}
- </h3>
- <div class="flex flex-col justify-between xl:flex-row">
- <div class="xl:pt-8">
- {% for article_page in month_article_data.left_column %}
- {% include 'main/includes/work_article_preview.html' %}
- {% empty %}
- <div class="p-7 flex flex-col max-w-xl mb-8" />
- {% endfor %}
- </div>
- <div class="relative border border-violet-400 mx-8 hidden xl:block">
- <div class="absolute bg-violet-400 p-1 text-white font-bold" style="transform: translateX(-50%); top: -1rem">
- {{ month_article_data.month_text }}
- </div>
- </div>
- <div class="xl:pt-14">
- {% for article_page in month_article_data.right_column %}
- {% include 'main/includes/work_article_preview.html' %}
- {% empty %}
- <div class="p-7 flex flex-col max-w-xl mb-8" />
- {% endfor %}
- </div>
- </div>
- </div>
-{% endfor %}
\ No newline at end of file
diff --git a/main/templates/main/blocks/articles_timeline_block.html b/main/templates/main/blocks/articles_timeline_block.html
new file mode 100644
index 0000000000000000000000000000000000000000..f192f8ed8d55db41c6d92f6957b1c3ed17dc924e
--- /dev/null
+++ b/main/templates/main/blocks/articles_timeline_block.html
@@ -0,0 +1,29 @@
+{% for month_article_data in article_data_list %}
+ <div class="mb-4">
+ <h2 class="head-4xl mb-5 xl:hidden">
+ {{ month_article_data.month_text }}
+ </h2>
+ <div class="article-timeline-grid justify-between">
+ <div class="article-timeline-grid__left-article xl:pt-8">
+ {% for article_page in month_article_data.left_column %}
+ {% include 'main/includes/work_article_preview.html' %}
+ {% empty %}
+ <div class="p-7 flex flex-col max-w-xl mb-8"/>
+ {% endfor %}
+ </div>
+ <div class="article-timeline-grid__timeline relative border border-violet-400 hidden xl:block">
+ <div class="article-timeline--month absolute bg-violet-400 p-1 text-white font-bold">
+ {{ month_article_data.month_text }}
+
+ </div>
+ </div>
+ <div class="article-timeline-grid__right-article xl:pt-14">
+ {% for article_page in month_article_data.right_column %}
+ {% include 'main/includes/work_article_preview.html' %}
+ {% empty %}
+ <div class="p-7 flex flex-col max-w-xl mb-8"/>
+ {% endfor %}
+ </div>
+ </div>
+ </div>
+{% endfor %}
\ No newline at end of file
diff --git a/main/templates/main/blocks/boxes_block.html b/main/templates/main/blocks/boxes_block.html
index 09c431a7dd485d1207bdacb4b68d9b65862fc55d..531b82b48ee2d67fdef86326a3c9ff6156bdf73c 100644
--- a/main/templates/main/blocks/boxes_block.html
+++ b/main/templates/main/blocks/boxes_block.html
@@ -1,19 +1,19 @@
-{% load wagtailimages_tags %}
+{% load static 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">
+<div class="bg-cover bg-no-repeat section-clip py-16 xl:h-screen lg:py-36"
+ style="background-image: url('{% static 'main/images/background-images/bg-join-us.jpg' %}')">
+ <div class="container--wide mx-auto z-10">
+ <h2 class="head-7xl xl:text-center mb-6 xl:mb-28">
{{ self.title }}
</h2>
- <div class="flex flex-wrap justify-center items-center">
+ <div class="flex flex-wrap gap-2 md:gap-1 justify-center items-center md:flex-row">
{% for box in self.list %}
- <div class="mb-1 mr-1 w-60 w-80 h-80 flex bg-white flex-col items-center justify-center md:mr-1">
+ <div class="w-96 h-72 flex bg-white flex-col items-center justify-center drop-shadow-xl xl:m-0 sm:w-80 sm:h-80">
{% image box.image max-200x200 as box_img %}
<img
src="{{ box_img.url }}"
alt=""
- class="mb-8"
+ class="mb-8 max-w-20 max-h-20"
>
<h5 class="head-4xl mb-8">
{{ box.title }}
diff --git a/main/templates/main/blocks/homepage_carousel_block.html b/main/templates/main/blocks/homepage_carousel_block.html
index 0c427a31eefd3bf2d987802e337dc3b13167e031..b72c39239e969a1bcc3ebf2607db856ccc7bc33b 100644
--- a/main/templates/main/blocks/homepage_carousel_block.html
+++ b/main/templates/main/blocks/homepage_carousel_block.html
@@ -7,12 +7,10 @@
{% image slide.image fill-1920x1020 as slide_img %}
<img src="{{ slide_img.url }}" draggable="false">
<div class="header-carousel--text grid-container">
- <div class="grid-content-with-right-side">
+ <div class="grid-content-with-right-side h-fit">
<h1 class="text-white">{{ slide.line_1 }}</h1>{# TODO SEO <h1><span><span> #}
- <h1 class="text-orange-250">{{ slide.line_2 }}</h1>
-
- {% include 'main/includes/button_animated.html' with btn_link=slide.button_link btn_text=slide.button_text %}
- </a>
+ <h1 class="text-orange-250 mb-2">{{ slide.line_2 }}</h1>
+ {% include 'main/includes/button_animated.html' with btn_link=slide.button_link btn_text=slide.button_text extra_classes="btn-carousel" %}
</div>
</div>
</div>
diff --git a/main/templates/main/blocks/news_block.html b/main/templates/main/blocks/news_block.html
index 28b4b5a3594cf5170d26e23e395920e13ad97d00..58189ff2e6c59db82d8f1606e520a717c0b75c2b 100644
--- a/main/templates/main/blocks/news_block.html
+++ b/main/templates/main/blocks/news_block.html
@@ -1,13 +1,13 @@
{% load wagtailcore_tags wagtailimages_tags shared_filters %}
<div class="bg-cover bg-no-repeat section-clip mb-8 py-16 lg:py-36 lg:mb-16"
- style="background-image: url('https://i.picsum.photos/id/630/1980/1400.jpg?hmac=WjDo021fzd9SaIlmsi9LtZJApZ02RMzdG0bYLx8iXOo')">
+ style="background-image: url('{% static 'main/images/background-images/bg-join-us.jpg' %}')">
<div class="container--medium mx-auto px-4">
- <h2 class="head-7xl text-center mb-6 xl:mb-28">
+ <h2 class="head-7xl xl:text-center mb-6 xl:mb-28">
{{ self.title }}
</h2>
<div class="flex flex-wrap mb-5 lg:mb-10">
{% image article_data_list.0.image original as article_img %}
- <img src="{{ article_img.url }}" draggable="false" alt="" class="lg:max-w-lg lg:mr-11">
+ <img src="{{ article_img.url }}" draggable="false" alt="" class="lg:max-w-lg lg:mr-11 h-fit">
<div class="flex flex-col max-w-xl items-start">
<span class="text-green-500 head-3xl mt-10 mb-4 lg:mb-8">{{ article_data_list.0.date }}</span>
<h5 class="head-4xl mb-5 lg:mb-10">{{ article_data_list.0.title }}</h5>
@@ -20,4 +20,4 @@
<ui-article-carousel></ui-article-carousel>
</div>
</div>
-</div>
\ No newline at end of file
+</div>
diff --git a/main/templates/main/blocks/people_overview_block.html b/main/templates/main/blocks/people_overview_block.html
index 0ff278e70339e8737f55adb8cfa16c97f113043b..322d84c820d3386caa3688d22bccf5caf3264c6b 100644
--- a/main/templates/main/blocks/people_overview_block.html
+++ b/main/templates/main/blocks/people_overview_block.html
@@ -1,13 +1,13 @@
{% load wagtailimages_tags %}
-<div class="container--medium mb-8 lg:mb-16">
- <h2 class="head-7xl text-center mb-6 xl:mb-28">
+<div class="container--medium mb-8 xl:h-screen flex flex-col justify-center lg:mb-16">
+ <h2 class="head-7xl xl:text-center mb-6 xl:mb-28">
{{ self.title }}
</h2>
- <div class="flex flex-wrap space-x-1 justify-center items-center">
+ <div class="flex flex-wrap space-x-1 justify-center gap-2 md:gap-1 items-center">
{% for box in self.list %}
{% image box.image fill-500x500 as box_image %}
- <div class="w-full max-w-xs mb-1 w-80 h-80 flex flex-col items-center justify-center"
+ <div class="w-96 h-60 flex bg-white flex-col items-center bg-cover justify-center drop-shadow-xl xl:m-0 sm:w-80 sm:h-80"
style="background-image: url('{{ box_image.url }}')">
<h5 class="head-alt-md text-white mt-24 mb-8">
{{ box.title }}
diff --git a/main/templates/main/blocks/regions_block.html b/main/templates/main/blocks/regions_block.html
index d90926826aa655bb078fb7d926c262b09640cf8a..14f767eeb4b9804b889c3994f46e8b3e2df7fb8c 100644
--- a/main/templates/main/blocks/regions_block.html
+++ b/main/templates/main/blocks/regions_block.html
@@ -1,7 +1,9 @@
+{% load static %}
+
<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')">
+ style="background-image: url('{% static 'main/images/background-images/bg-map.jpg' %}')">
<div class="container--medium mx-auto px-4 ">
- <h2 class="head-7xl text-center mb-6 xl:mb-28">
+ <h2 class="head-7xl xl:text-center mb-6 xl:mb-28">
{{ self.title }}
</h2>
<div class="flex flex-wrap">
@@ -18,13 +20,12 @@
{% endfor %}
</select>
</div>
- <div id='searchResultWrapper' class="mb-3">
+ <div id='searchResultWrapper'>
{% include 'main/includes/small_article_preview.html' with article_data_list=article_data_list %}
</div>
</div>
</div>
</div>
- <div></div>
</div>
</div>
<script type="text/javascript">
@@ -41,4 +42,4 @@
resultWrappers.innerHTML = data.html;
});
}
-</script>
\ No newline at end of file
+</script>
diff --git a/main/templates/main/blocks/twitter_block.html b/main/templates/main/blocks/twitter_block.html
index 867d5b9b7e3da1c8475fd7825db50392650be312..d3781e862bf3d3f64059f80be9dc60ae0f5df4f8 100644
--- a/main/templates/main/blocks/twitter_block.html
+++ b/main/templates/main/blocks/twitter_block.html
@@ -1,7 +1,9 @@
-<div class="container--medium mx-auto mb-8 lg:mb-16">
- <h2 class="head-7xl text-center mb-6 xl:mb-28">
+<div class="container--wide mx-auto mb-8 lg:mb-16">
+ <div class="flex flex-wrap justify-center items-center">
+ <h2 class="w-full head-7xl xl:text-center mb-6 xl:mb-28">
{{ self.title }}
</h2>
+ </div>
<div id="tweetsList">
{% include 'main/includes/twitter_widget.html' with tweet_list=tweet_list %}
</div>
diff --git a/main/templates/main/includes/button_animated.html b/main/templates/main/includes/button_animated.html
index 62462cfc21defa4f53cd0535e2337c25aa100003..1bc3ae08f3e7c8d408568ebd45688820aacf2065 100644
--- a/main/templates/main/includes/button_animated.html
+++ b/main/templates/main/includes/button_animated.html
@@ -1,8 +1,8 @@
<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">
+ <span class="btn text-lg bg-black text-white w-32 lg:text-base">
{{ btn_text | default_if_none:"Číst dále" }}
</span>
- <span class="btn text-sm bg-white text-black w-32 lg:text-base">
+ <span class="btn text-lg bg-white text-black w-32 lg:text-base">
{{ btn_text | default_if_none:"Číst dále" }}
</span>
</a>
diff --git a/main/templates/main/includes/layout/photo_page_header.html b/main/templates/main/includes/layout/photo_page_header.html
index 8fbf7a82c3250de5d0f060d6e7e282c5453ab54e..a37d8e5cc6ef452aa51dfcd7b772b55f3e157dd6 100644
--- a/main/templates/main/includes/layout/photo_page_header.html
+++ b/main/templates/main/includes/layout/photo_page_header.html
@@ -4,13 +4,17 @@
class="bg-black flex items-center header-clip photo-header py-32 mb-20 w-full bg-no-repeat bg-cover bg-center"
style="background-image: url('{{ image_url | default_if_none:"https://cc.cz/wp-content/uploads/2022/04/bartos-otv.jpg" }}')"
>
- <div class="grid-container header-max-width pt-16">
+ <div class="grid-container">
+ <div class="grid-content-with-right-side header-max-width pt-40 sm:pt-0">
<div class="pl-4 pr-2 col-start-1 col-end-3 sm:col-start-2 sm:col-end-13 sm:pr-0">
- <h1 class="font-alt text-white">
- <span class="text-2xl">{{ before_title | default_if_none:"" }}</span><br>
- <span class="font-alt text-7xl">{{ page.title | default_if_none:"" }}</span><span class="text-2xl">{{ after_title | default_if_none:"" }}</span><br>
+ <div class="text-lg sm:text-3xl text-green-500 mb-4 font-medium sm:mb-8">
+ <span class="text-2xl">{{ before_title | default_if_none:"" }}</span>
+ </div>
+ <h1 class="font-alt text-white text-3xl md:text-5xl leading-9 sm:leading-none lg:text-6xl">
+ <span class="font-alt">{{ page.title | default_if_none:"" }}</span><span class="text-2xl">{{ after_title | default_if_none:"" }}</span><br>
<span class="font-alt">{{ subtitle | default_if_none:"" }}</span>
</h1>
</div>
</div>
+ </div>
</header>
diff --git a/main/templates/main/includes/layout/simple_page_header.html b/main/templates/main/includes/layout/simple_page_header.html
index 6dc4646e014b33c0ea71f3efc59b937b2d3fbbf3..0c3f226422cc12e2c43c499145947779efbdc124 100644
--- a/main/templates/main/includes/layout/simple_page_header.html
+++ b/main/templates/main/includes/layout/simple_page_header.html
@@ -1,4 +1,4 @@
-<header class="bg-black flex items-center simple-header-height header-clip mb-8 xl:mb-24 xl:pt-24 w-full">
+<header class="bg-black flex items-center simple-header-height header-clip mb-8 xl:mb-24 xl:pb-24 xl:pt-44 w-full">
<div class="grid-container header-max-width">
<div class="grid-content">
<h1 class="head-8xl text-white">
diff --git a/main/templates/main/includes/newsletter_section.html b/main/templates/main/includes/newsletter_section.html
index fbe6829c74833535257164e0716b056ba47ba2f9..82dddf3626d4145a1ee92ececbb77430fcd88e6f 100644
--- a/main/templates/main/includes/newsletter_section.html
+++ b/main/templates/main/includes/newsletter_section.html
@@ -13,7 +13,7 @@
<input type="text" class="text-input bg-white form-field__control mb-3 w-full" value=""
placeholder="Tvůj email"/>
<div class="checkbox form-field__control flex items-center mb-3">
- <input type="checkbox" id="checkbox_1">
+ <input type="checkbox" id="checkbox_1" class="text-input bg-white form-field__control">
<label class="text-xs font-alt font-light" for="checkbox_1">"Souhlasím se zpracováním osobních údajů"</label>
</div>
{% include 'main/includes/button_animated.html' with btn_text="Odebírat" %}
diff --git a/main/templates/main/includes/person_article_preview.html b/main/templates/main/includes/person_article_preview.html
new file mode 100644
index 0000000000000000000000000000000000000000..77c4d2578705b22099bff08cbecc682959835740
--- /dev/null
+++ b/main/templates/main/includes/person_article_preview.html
@@ -0,0 +1,15 @@
+{% for article_page in article_data_list %}
+ <div class="flex flex-col justify-between items-start mb-9">
+ <div class="flex font-bold mb-4 text-xs text-white uppercase">
+ <span class="bg-green-500 mr-1 px-1">Duben 2022</span>
+ <span class="bg-violet-600 mr-1 px-1">#ENERGETIKA</span>
+ </div>
+ <h4 class="head-3xl mb-4">
+ {{ article_page.title }}
+ </h4>
+ <p class="mb-6">
+ {{ article_page.perex }}
+ </p>
+ {% include 'main/includes/button_animated.html' with btn_link=article_page.url btn_text="Číst dále" %}
+ </div>
+{% endfor %}
diff --git a/main/templates/main/includes/person_contact_big.html b/main/templates/main/includes/person_contact_big.html
index da113cea3c6323886f14a4da8a03af57cb7d774b..4ed3a2e26632aa28584f2725f7d995c0b4c14c04 100644
--- a/main/templates/main/includes/person_contact_big.html
+++ b/main/templates/main/includes/person_contact_big.html
@@ -1,22 +1,22 @@
{% load wagtailimages_tags %}
-<div class="flex mb-8 person-box-big max-w-md xl:max-w-xl flex-col xl:flex-row xl:mb-16">
- <div class="shrink-0 mr-2">
+<div class="flex mb-8 person-box-big max-w-sm gap-6 xl:max-w-xl flex-col xl:flex-row xl:mb-16">
+ <div class="xl:shrink-0">
{% image person_page.profile_image fill-350x350 as profile_image %}
<img
- class="rounded-full shadow-sm w-30 xl:w-60 mb-2"
+ class="rounded-full shadow-sm w-30 xl:w-60"
src="{{ profile_image.url }}"
alt=" {{ person_page.title }}"
>
</div>
<div class="flex flex-col justify-between py-4">
- <div class="flex flex-col mb-4">
+ <div class="flex flex-col mb-8">
<h4 class="font-bold mb-2 text-2xl xl:text-4xl">
{{ person_page.title }}
</h4>
- <span class="leading-6 mb-6 w-10/12">
+ <span class="leading-6 mb-4 xl:mb-6 w-10/12">
{{ person_page.position | default_if_none:'' }}
</span>
- <span class="font-bold mb-1 text-grey-300">
+ <span class="font-bold mb-2 text-grey-300">
{{ person_page.phone | default_if_none:'' }}
</span>
<span class="text-turquoise-500 underline">
diff --git a/main/templates/main/includes/small_article_preview.html b/main/templates/main/includes/small_article_preview.html
index aabf40d157d10e7bed76f8153ec035c479fbdfb2..b31ebddb83e49d2caea87d4dd49cf09d673c7a8f 100644
--- a/main/templates/main/includes/small_article_preview.html
+++ b/main/templates/main/includes/small_article_preview.html
@@ -1,16 +1,16 @@
{% load wagtailimages_tags %}
{% for article_page in article_data_list %}
- <div class="flex">
+ <div class="flex mb-3">
{% image article_page.image fill-128x128 as image %}
<img
src='{{ image.url }}' alt=""
class="mr-4 h-32 w-32"
>
<div class="flex flex-col justify-between items-start">
- <span class="text-sm text-green-500 lg:text-base">
+ <span class="text-sm text-green-500 mb-2 lg:text-base">
{{ article_page.date | date }}
</span>
- <h4 class="text-sm uppercase lg:text-base">
+ <h4 class="font-alt leading-5 text-base uppercase lg:text-base mb-2">
{{ article_page.title }}
</h4>
{% include 'main/includes/button_animated.html' with btn_link=article_page.url btn_text="Číst dále" %}
diff --git a/main/templates/main/includes/twitter_widget.html b/main/templates/main/includes/twitter_widget.html
index 87c4a77e85843d4ddcb451f059ad5c1fbcacea02..78d1b6ecef7f9cc1c50b5d3b5ea3ffb76eb1ceac 100644
--- a/main/templates/main/includes/twitter_widget.html
+++ b/main/templates/main/includes/twitter_widget.html
@@ -1,25 +1,29 @@
<div class="flex flex-wrap justify-center mb-8 lg:mb-24">
{% for tweet in tweet_list %}
- <div class="w-full flex max-w-xs">
- <div class="p-4 flex flex-col items-center text-center border border-grey-100">
+ <div class="w-full flex max-w-sm sm:max-w-xs">
+ <div class="mb-5 p-4 flex flex-col items-center text-center border border-grey-100 sm:mb-0">
+ <div class="flex flex-row sm:flex-col items-center">
<img
class="rounded-full shadow-sm w-12 mb-2"
src="{{ tweet.author_img_url }}"
alt="user image"
/>
- <h5 class="font-alt mb-2">
+ <div class="flex flex-col sm:flex-col">
+ <h5 class="font-alt text-xl mb-2 sm:text-base">
{{ tweet.author_name }}
</h5>
<small class="mb-4 text-turquoise-400">
{{ tweet.author_username }}
</small>
- <p class="text-base leading-6 mb-2">
+ </div>
+ </div>
+ <p class="text-small sm:text-base leading-6 mb-2">
{{ tweet.text }}
</p>
- <a href="" class="hover:no-underline">
- <i class="ico--twitter text-turquoise-400 text-xl"></i>
+ <a href="twitter.com/{{ tweet.author_username }}" class="hover:no-underline">
+ <i class="ico--twitter text-turquoise-400 text-3xl sm:text-xl"></i>
</a>
</div>
</div>
{% endfor %}
-</div>
\ No newline at end of file
+</div>
diff --git a/main/templates/main/main_article_page.html b/main/templates/main/main_article_page.html
index ff04cb76b891384712e74f162369a1af7764994a..6d1e9db205893bc1f6c998f948acdb4636935fe1 100644
--- a/main/templates/main/main_article_page.html
+++ b/main/templates/main/main_article_page.html
@@ -8,10 +8,17 @@
{% endwith %}
{# {% routablepageurl page.root_page.articles_page "tags" as articles_tag_page_url %}#}
<main role="main" class="mb-10 xl:mb-32">
- <div class="grid-container mb-2 lg:mb-12">
+ <div class="grid-container mb-2 lg:mb-12 relative">
<div class="grid-left-side h-full bg-grey-150 left-tab">
- <div class="p-6">
+ <div class="p-6 flex flex-wrap flex-row items-center justify-between xl:items-start xl:flex-col">
<span class="font-bold 3xl:text-xl">AUTOR ČLÁNKU: <br> {{ page.author }}</span><br>
+ <div class="flex flex-row static bottom-0 xl:absolute sm:bottom-5">
+ {% for social in page.author_page.social_links %}
+ <a href="{{ social.value.link }}" class="flex hover:no-underline">
+ <i class="{{ social.value.icon }} mx-1"></i>
+ </a>
+ {% endfor %}
+ </div>
</div>
</div>
<div class="grid-content leading-6">
diff --git a/main/templates/main/main_articles_page.html b/main/templates/main/main_articles_page.html
index 863661a7912957e8d44b8ff500549df7b5d7023f..bf5e46d36420bc53f367d11a0948bddc60f18f77 100644
--- a/main/templates/main/main_articles_page.html
+++ b/main/templates/main/main_articles_page.html
@@ -2,65 +2,126 @@
{% load wagtailcore_tags wagtailimages_tags shared_filters %}
{% block content %}
- {% include 'main/includes/layout/simple_page_header.html' %}
+ {% include 'main/includes/layout/simple_page_header.html' %}
- <main role="main">
- <div class="grid-container mb-2 xl:mb-12">
- <div class="grid-content leading-6">
- <h2 class="head-xl mb-2">
- {{ page.perex }}
- </h2>
- <h2 class="head-xl mb-2">
- Projděte si archiv tiskových zpráv a souhrn našich nejvýraznějších aktivit
- </h2>
- </div>
- </div>
-
- <div class="grid-container article-section">
- <div class="grid-full mb-8">
- <div id="searchResultWrapper">
- {% include 'main/blocks/articles_block.html' with article_data_list=article_data_list %}
+ <main role="main">
+ <div class="grid-container mb-2 xl:mb-12">
+ <div class="grid-content leading-6">
+ <h2 class="head-xl mb-2">
+ {{ page.perex }}
+ </h2>
+ <h2 class="head-xl mb-2">
+ Projděte si archiv tiskových zpráv a souhrn našich nejvýraznějších aktivit
+ </h2>
+ </div>
+ </div>
+ <div class="__js-root">
+ <ui-view-provider :initial="{timeline: true, articles: false}" :sync-location="true"
+ v-slot="{ isCurrentView, toggleView }">
+ <div class="grid-container article-section mb-8">
+ <div class="grid-full">
+ <div class="flex justify-center">
+ <div class="switch">
+ <a @click="toggleView('timeline')" class="switch__item"
+ :class="{'switch__item--active': isCurrentView('timeline')}">Poslanecká sněmovna</a>
+ <a @click="toggleView('articles')" class="switch__item"
+ :class="{'switch__item--active': isCurrentView('articles')}">Vláda</a>
+ </div>
+ </div>
+ </div>
+ </div>
+ <template v-if="isCurrentView('timeline')">
+ <div class="mt-20">
+ <div class="grid-container article-section">
+ <div class="grid-full mb-8">
+ <div id="showMoreTimelineResultsWrapper">
+ {% include 'main/blocks/articles_timeline_block.html' with article_data_list=article_timeline_list %}
+ </div>
+ </div>
+ <div class="flex justify-center">
+ <a
+ onclick="showMoreTimelineArticles(event, this)"
+ href="#"
+ data-url="{{ page_url }}?months="
+ data-months="2"
+ class="btn btn__slide__wrap"
+ >
+ <span class="btn text-sm bg-black text-white w-32 lg:text-base">
+ Zobrazit další
+ </span>
+ <span class="btn text-sm bg-white text-black w-32 lg:text-base">
+ Zobrazit další
+ </span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </template>
+ <template v-if="isCurrentView('articles')">
+ <section class="grid-container mb-3 justify-start xl:mb-14">
+ <div class="grid-content-with-right-side">
+ <div class="leading-6">
+ <h2 class="head-4xl mb-5 xl:hidden">
+ Články
+ </h2>
+ <div id="searchArticleResultWrapper">
+ {% include 'main/includes/person_article_preview.html' with article_data_list=article_article_list %}
+ </div>
+ <div class="flex justify-center">
+ <a
+ onclick="showMoreArticles(event, this)"
+ href="#"
+ data-url="{{ page_url }}?page="
+ data-page="2"
+ class="btn btn__slide__wrap"
+ >
+ <span class="btn text-sm bg-black text-white w-32 lg:text-base">
+ Zobrazit další
+ </span>
+ <span class="btn text-sm bg-white text-black w-32 lg:text-base">
+ Zobrazit další
+ </span>
+ </a>
+ </div>
+ </div>
+ </div>
+ </section>
+ </template>
+ </ui-view-provider>
</div>
- {% if show_next_articles %}
- <div class="text-center">
- <a
- onclick="showMoreArticles(event, this)"
- href="#"
- data-url="{{ page_url }}?months="
- data-months="2"
- class="btn btn__slide__wrap"
- >
- <span class="btn text-sm bg-black text-white w-32 lg:text-base">
- Zobrazit další
- </span>
- <span class="btn text-sm bg-white text-black w-32 lg:text-base">
- Zobrazit další
- </span>
- </a>
- </div>
- </div>
+ </main>
- {% endif %}
- </div>
- </main>
+ <script type="text/javascript">
+ async function showMoreTimelineArticles(event, btn) {
+ event.preventDefault()
- <script type="text/javascript">
- async function showMoreArticles(event, btn) {
- event.preventDefault()
+ const showMoreTimelineResultsWrapper = document.getElementById('showMoreTimelineResultsWrapper')
+ const url = btn.getAttribute('data-url') + btn.getAttribute('data-months')
- const searchResultWrapper = document.getElementById('searchResultWrapper')
- const url = btn.getAttribute('data-url') + btn.getAttribute('data-months')
+ const response = await fetch(url, {
+ method: "GET",
+ headers: {"X-Requested-With": "XMLHttpRequest"},
+ })
+ const data = await response.json()
+ showMoreTimelineResultsWrapper.innerHTML = data.html
+ btn.setAttribute('data-months', parseInt(btn.getAttribute('data-months')) + 1)
+ }
- const response = await fetch(url, {
- method: "GET",
- headers: {"X-Requested-With": "XMLHttpRequest"},
- })
- const data = await response.json()
+ async function showMoreArticles(event, btn) {
+ event.preventDefault()
- if (data.last_article) { btn.hide() }
+ let searchArticleResultWrapper = document.getElementById('searchArticleResultWrapper');
+ let url = btn.getAttribute('data-url') + btn.getAttribute('data-page')
- searchResultWrapper.innerHTML = data.html
- btn.setAttribute('data-months', parseInt(btn.getAttribute('data-months')) + 1)
- }
- </script>
+ const response = await fetch(url, {
+ method: "GET",
+ headers: {"X-Requested-With": "XMLHttpRequest"},
+ })
+ const data = await response.json()
+ searchArticleResultWrapper.innerHTML += data.html;
+ if (btn.getAttribute('data-page') === data.last_page)
+ btn.hide();
+ btn.setAttribute('data-page', parseInt(btn.getAttribute('data-page')) + 1)
+ }
+ </script>
{% endblock content %}
diff --git a/main/templates/main/main_people_page.html b/main/templates/main/main_people_page.html
index b7d9f0112e86bc0d5e4e32560d5384e72aa2e338..1144a6f4bdbea55496fdf31dcacb300dd77240f7 100644
--- a/main/templates/main/main_people_page.html
+++ b/main/templates/main/main_people_page.html
@@ -5,10 +5,10 @@
{% include 'main/includes/layout/simple_page_header.html' %}
-<main role="main">
+<main role="main" class="mb-4 xl:mb-20">
<div class="grid-container">
<div class="grid-content">
- <p class="font-alt leading-4 xl:leading-6 mb-3 text-base xl:text-xl xl:mb-12">
+ <p class="font-alt text-xl leading-7 mb-5">
{{ page.perex }}
</p>
</div>
@@ -21,17 +21,19 @@
v-slot="{ isCurrentView, toggleView }"
>
<div class="flex justify-center mb-12">
- <div class="switch">
- {% for people_group in page.people %}
- <a @click="toggleView('{{ people_group.value.slug }}-{{ forloop.counter }}')" class="switch__item"
- :class="{'switch__item--active': isCurrentView('{{ people_group.value.slug }}-{{ forloop.counter }}')}"
- >
- {{ people_group.value.title }}
- </a>
- {% endfor %}
- </div>
+ <ui-horizontal-scrollable>
+ <div class="switch">
+ {% for people_group in page.people %}
+ <a @click="toggleView('{{ people_group.value.slug }}-{{ forloop.counter }}')" class="switch__item"
+ :class="{'switch__item--active': isCurrentView('{{ people_group.value.slug }}-{{ forloop.counter }}')}"
+ >
+ {{ people_group.value.title }}
+ </a>
+ {% endfor %}
+ </div>
+ </ui-horizontal-scrollable>
</div>
- <div class="flex flex-wrap justify-center mb-12">
+ <div class="flex flex-wrap gap-4 xl:justify-center">
{% for people_group in page.people %}
<template v-if="isCurrentView('{{ people_group.value.slug }}-{{ forloop.counter }}')">
{% for person_page in people_group.value.person_list %}
diff --git a/main/templates/main/main_person_page.html b/main/templates/main/main_person_page.html
index 1102ae3b0b496d1ec985bcd4a0256bb7c8f91d15..7f1eab6b669de3ba86767e9c11b7674b6b69175e 100644
--- a/main/templates/main/main_person_page.html
+++ b/main/templates/main/main_person_page.html
@@ -50,26 +50,33 @@
</section>
</div>
{% if tweet_list %}
- <section class="grid-container no-max">
+ <section class="grid-container no-max mr-0 person-twitter-section mb-4 xl:mb-20">
<div class="grid-content-with-right-side">
- <h2 class="head-4xl text-center xl:text-left">
+ <h2 class="head-4xl text-left">
Aktuálně na Twitteru
</h2>
- <div class="mb-8 flex flex-wrap">
- {% for tweet in page.tweet_list %}
- <div class="md:w-1/3 lg:w-1/4">
- <div class="p-4 flex flex-col items-center text-center border border-grey-100">
- <img class="rounded-full shadow-sm w-12 mb-2" src="{{ tweet.author_img_url }}"
- alt="user image"/>
- <h5 class="font-alt mb-2">{{ tweet.author_name }}</h5>
- <small class="mb-4 text-turquoise-400">@{{ tweet.author_username }}</small>
- <p class="text-base leading-6 mb-2">{{ tweet.text }}</p>
- <a href="twitter.com/{{ tweet.author_username }}" class="hover:no-underline">
- <i class="ico--twitter text-turquoise-400 text-xl"></i>
- </a>
+ <div class="__js-root twitter-carousel-root">
+ <ui-twitter-carousel>
+ {% for tweet in page.tweet_list %}
+ <div class="w-full flex max-w-xs">
+ <div class="mb-5 p-4 flex flex-col items-center text-center border border-grey-100 sm:mb-0">
+ <div class="flex flex-row sm:flex-col items-center">
+ <img class="rounded-full shadow-sm w-12 h-12 mb-4 sm:mb-2"
+ src="{{ tweet.author_img_url }}"
+ alt="user image"/>
+ <div class="flex flex-col sm:flex-col">
+ <h5 class="font-alt text-xl mb-2 sm:text-base">{{ tweet.author_name }}</h5>
+ <small class="mb-4 text-turquoise-400">@{{ tweet.author_username }}</small>
+ </div>
+ </div>
+ <p class="text-small sm:text-base leading-6 mb-2">{{ tweet.text }}</p>
+ <a href="twitter.com/{{ tweet.author_username }}" class="hover:no-underline" target="_blank">
+ <i class="ico--twitter text-turquoise-400 text-xl"></i>
+ </a>
+ </div>
</div>
- </div>
- {% endfor %}
+ {% endfor %}
+ </ui-twitter-carousel>
</div>
</div>
</section>
diff --git a/main/templates/main/main_program_page.html b/main/templates/main/main_program_page.html
index 3ed251169bcfec20d37f48af45093dc3ec962c1f..ffe8c90116be898483363b8b0852707567bc3bf6 100644
--- a/main/templates/main/main_program_page.html
+++ b/main/templates/main/main_program_page.html
@@ -4,22 +4,23 @@
{% block content %}
{% include 'main/includes/layout/simple_page_header.html' %}
- <main role="main">
+ <main role="main" class="mb-4 xl:mb-20">
<div class="grid-container">
<div class="grid-content">
- <p class="font-alt leading-6 mb-12 text-xl">
+ <p class="font-alt text-xl leading-7 mb-5">
{{ page.perex }}
</p>
</div>
</div>
- <div class="container--medium">
+ <div class="">
<div class="__js-root">
<ui-view-provider
:initial="{ {% for program_group in page.program %}'{{ program_group.value.slug }}-{{ forloop.counter }}':{% if forloop.counter0 %}false{% else %}true{% endif %},{% endfor %} }"
:sync-location="true"
v-slot="{ isCurrentView, toggleView }"
>
- <div class="mb-12">
+ <div class="mb-12 container--medium flex justify-start">
+ <ui-horizontal-scrollable>
<div class="switch">
{% for program_group in page.program %}
<a @click="toggleView('{{ program_group.value.slug }}-{{ forloop.counter }}')" class="switch__item"
@@ -28,16 +29,16 @@
</a>
{% endfor %}
</div>
+ </ui-horizontal-scrollable>
</div>
- <div class="mb-12">
{% for program_group in page.program %}
<template v-if="isCurrentView('{{ program_group.value.slug }}-{{ forloop.counter }}')">
{% for item in program_group.value.point_list %}
- <div class="flex mb-6">
+ <div class="grid-container mb-12">
{% image item.icon fill-150x150 as icon %}
- <img src="{{ icon.url }}" alt="{{ item.title }}" class="mr-6 text-6xl">
- <div class="flex flex-col">
+ <img src="{{ icon.url }}" alt="{{ item.title }}" class="grid-left-side mr-6 text-6xl xl:justify-self-end">
+ <div class="grid-content flex flex-col">
<h3 class="font-alt mb-4 text-4xl">
{{ item.title }}
</h3>
@@ -45,11 +46,10 @@
{{ item.text }}
</p>
</div>
- </div>
+ </div>
{% endfor %}
</template>
{% endfor %}
- </div>
</ui-view-provider>
</div>
</div>