Files
old-saburly-wagtail-web/templates/home/home_page.html
2024-09-16 20:16:16 +02:00

79 lines
3.1 KiB
HTML

{% extends "base.html" %}
{% load wagtailcore_tags %}
{% block body_class %}template-homepage{% endblock %}
{% block content %}
<section class="relative bg-white">
<div class="container mx-auto items-center flex xl:flex-row justify-between flex-col p-4">
<div class="lg:w-3/5 text-center lg:text-left">
<h2 class="text-3xl xsm:text-4xl md:text-5xl py-2 my-2 lg:text-5xl">
{{ page.intro_title|richtext }}
</h2>
<div class="mb-10 text-base md:text-lg lg:text-lg text-left leading-smaller sm:leading-mid md:leading-normal lg:leading-loose">
{{ page.intro_text|richtext }}
</div>
</div>
<div class="lg:w-2/5">
<div class="md:max-h-sm md:max-w-35 mx-auto">
{{ page.intro_image|richtext }}
</div>
</div>
</div>
</section>
{% for item in page.homepage_sections.all %}
{% if item.section_image %}
{% if forloop.counter|divisibleby:2 %}
<section class="relative bg-white">
<div class="container mx-auto items-center flex xl:flex-row justify-between flex-col p-4">
<div class="lg:w-3/5 text-center lg:text-left">
<h2 class="text-3xl xsm:text-4xl md:text-5xl py-2 my-2 lg:text-5xl">
{{ item.section_title|richtext }}
</h2>
<div class="mb-10 text-base md:text-lg lg:text-lg text-left leading-smaller sm:leading-mid md:leading-normal lg:leading-loose">
{{ item.section_text|richtext }}
</div>
</div>
<div class="lg:w-2/5">
<img src="{{ item.section_image.file.url }}" alt="{{ item.section_title }}" class="md:max-h-sm md:max-w-35 mx-auto">
</div>
</div>
</section>
{% else %}
<section class="relative bg-gray-100">
<div class="container mx-auto p-4">
<div class="text-center mb-8"></div>
<div class="flex flex-col lg:flex-row-reverse">
<div class="lg:w-3/5 mb-4 lg:mb-0 lg:pl-8">
<div class="text-3xl xsm:text-4xl md:text-5xl py-2 my-2 lg:text-5xl">
{{ item.section_title|richtext}}
</div>
<div class="mb-10 text-base md:text-lg lg:text-lg text-left leading-smaller sm:leading-mid md:leading-normal lg:leading-loose">
{{ item.section_text|richtext}}
</div>
</div>
<div class="lg:w-2/5 flex items-center justify-center">
<img src="{{ item.section_image.file.url }}" alt="Intro Image" class="md:max-h-sm md:max-w-35 mx-auto">
</div>
</div>
</div>
</section>
{% endif %}
{% else %}
<section class="relative bg-white">
<div class="container mx-auto grid grid-cols-1 gap-6 p-4">
<div>
<div class="text-3xl xsm:text-4xl md:text-5xl py-2 my-2 lg:text-5xl">
{{ item.section_title|richtext }}
</div>
</div>
<div class="text-base md:text-lg lg:text-lg text-left leading-smaller sm:leading-mid md:leading-normal lg:leading-loose">
{{ item.section_text|richtext }}
</div>
</div>
</section>
{% endif %}
{% endfor %}
{% endblock content %}