diff --git a/district/templates/district/district_article_page.html b/district/templates/district/district_article_page.html index 787b3ee474ace4a5614050d0aad6df6093e38f3e..da90b00275bc082d1372c69d147eef746e0d2dac 100644 --- a/district/templates/district/district_article_page.html +++ b/district/templates/district/district_article_page.html @@ -2,92 +2,93 @@ {% load static wagtailcore_tags wagtailimages_tags wagtailroutablepage_tags %} {% block content %} -{% routablepageurl page.root_page.articles_page "tags" as articles_tag_page_url %} - <article> - <link itemprop="mainEntityOfPage" href="{{ page.url }}"> - <meta itemprop="datePublished" content="{{ page.last_published_at }}"> - <meta itemprop="dateModified" content="{{ page.latest_revision_created_at }}"> + {% routablepageurl page.root_page.articles_page "tags" as articles_tag_page_url %} + <article> + <link itemprop="mainEntityOfPage" href="{{ page.url }}"> + <meta itemprop="datePublished" content="{{ page.last_published_at }}"> + <meta itemprop="dateModified" content="{{ page.latest_revision_created_at }}"> - <h1 class="head-alt-md md:head-alt-lg max-w-5xl mb-4"> - {{ page.title }} - </h1> + <h1 class="head-alt-md md:head-alt-lg max-w-5xl mb-4"> + {{ page.title }} + </h1> - <div class="flex flex-col md:flex-row md:items-center"> - <div class="inline-flex divide-x flex-grow"> - <span class="pr-2">{{ page.date|date:"DATE_FORMAT" }}</span> - <span class="pl-2" itemprop="author" itemtype="http://schema.org/Person" itemscope=""> + <div class="flex flex-col md:flex-row md:items-center"> + <div class="inline-flex divide-x flex-grow"> + <span class="pr-2">{{ page.date|date:"DATE_FORMAT" }}</span> + <span class="pl-2" itemprop="author" itemtype="http://schema.org/Person" itemscope=""> {% if page.author_page %} <a href="{{ page.author_page.url }}" itemprop="name">{{ page.author }}</a> {% else %} - <span itemprop="name">{{ page.author }}</span> + <span itemprop="name">{{ page.author|default_if_none:'' }}</span> {% endif %} </span> - </div> - <div class="my-4"> - {% for tag in page.tags.all %} - <a href="{{ articles_tag_page_url }}?tag={{ tag.slug }}" class="btn btn--grey-125 btn--condensed"> - <div class="btn__body ">{{ tag }}</div> - </a> - {% endfor %} - </div> </div> + <div class="my-4"> + {% for tag in page.tags.all %} + <a href="{{ articles_tag_page_url }}?tag={{ tag.slug }}" class="btn btn--grey-125 btn--condensed"> + <div class="btn__body ">{{ tag }}</div> + </a> + {% endfor %} + </div> + </div> + {% if page.image %} <figure class="figure"> {% image page.image width-2000 as img %} - <img src="{{ img.url }}" alt="{{ page.title }}" /> + <img src="{{ img.url }}" alt="{{ page.title }}"/> </figure> + {% endif %} + <div class="lg:flex mt-8 lg:space-x-16"> + <div class="lg:w-2/3"> + <div itemprop="description" class="w-full space-y-8"> + {% for block in page.content %} + {% include_block block %} + {% endfor %} - <div class="lg:flex mt-8 lg:space-x-16"> - <div class="lg:w-2/3"> - <div itemprop="description" class="w-full space-y-8"> - {% for block in page.content %} - {% include_block block %} - {% endfor %} - - {% if page.author_page %} - {% include "shared/person_badge_snippet.html" with person_page=page.author_page title="Autor" %} - {% endif %} - </div> - + {% if page.author_page %} + {% include "shared/person_badge_snippet.html" with person_page=page.author_page title="Autor" %} + {% endif %} </div> - <div class="pt-8 lg:w-1/3 md:pt-0"> - <div class="sharebox md:card md:elevation-10 "> - <div class="md:card__body"> - <span class="head-alt-base md:head-alt-md">Sdílení je aktem lásky</span> - <div class="flex w-full space-x-4 pt-4 md:pt-8 text-center text-white"> - <a - href="https://www.facebook.com/sharer/sharer.php?u={{ page.full_url|urlencode }}" - onclick="window.open(this.href, 'pop-up', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;" - class="bg-brands-facebook px-8 py-3 text-2xl w-full" - ><i class="ico--facebook"></i></a> - <a - href="https://twitter.com/intent/tweet?text={{ page.title|urlencode }}&url={{ page.full_url|urlencode }}" - onclick="window.open(this.href, 'pop-up', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;" - class="bg-brands-twitter px-8 py-3 text-2xl w-full" - ><i class="ico--twitter"></i></a> - </div> - </div> - <div class="h-52 overflow-hidden hidden md:block"> - <img src="{% static "shared/img/flag.png" %}" alt="Pirátská strana" class="w-80 object-cover m-auto"/> + + </div> + <div class="pt-8 lg:w-1/3 md:pt-0"> + <div class="sharebox md:card md:elevation-10 "> + <div class="md:card__body"> + <span class="head-alt-base md:head-alt-md">Sdílení je aktem lásky</span> + <div class="flex w-full space-x-4 pt-4 md:pt-8 text-center text-white"> + <a + href="https://www.facebook.com/sharer/sharer.php?u={{ page.full_url|urlencode }}" + onclick="window.open(this.href, 'pop-up', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;" + class="bg-brands-facebook px-8 py-3 text-2xl w-full" + ><i class="ico--facebook"></i></a> + <a + href="https://twitter.com/intent/tweet?text={{ page.title|urlencode }}&url={{ page.full_url|urlencode }}" + onclick="window.open(this.href, 'pop-up', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;" + class="bg-brands-twitter px-8 py-3 text-2xl w-full" + ><i class="ico--twitter"></i></a> </div> </div> + <div class="h-52 overflow-hidden hidden md:block"> + <img src="{% static "shared/img/flag.png" %}" alt="Pirátská strana" class="w-80 object-cover m-auto"/> + </div> </div> </div> - </article> + </div> + </article> - {% if related_articles|length %} - <section class="mt-16 md:mt-24"> - <h1 class="head-alt-base md:head-alt-md pb-4"> - Další podobné články - </h1> + {% if related_articles|length %} + <section class="mt-16 md:mt-24"> + <h1 class="head-alt-base md:head-alt-md pb-4"> + Další podobné články + </h1> - <div class="article-card-list grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 lg:gap-8"> - {% for article in related_articles %} - {% include "shared/article_preview.html" %} - {% endfor %} - </div> + <div class="article-card-list grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 lg:gap-8"> + {% for article in related_articles %} + {% include "shared/article_preview.html" %} + {% endfor %} + </div> - {% include "shared/more_articles_snippet.html" %} - </section> - {% endif %} + {% include "shared/more_articles_snippet.html" %} + </section> + {% endif %} {% endblock %}