program2021: First prototype

.isort.cfg

@@ -4,4 +4,4 @@ line_length = 88
 multi_line_output = 3
 default_sectiont = "THIRDPARTY"
 include_trailing_comma = true
-known_third_party = arrow,django,environ,faker,ics,pirates,pytest,pytz,requests,snapshottest,wagtail,wagtailmetadata
+known_third_party = arrow,django,environ,faker,ics,modelcluster,pirates,pytest,pytz,requests,snapshottest,taggit,wagtail,wagtailmetadata

README.md

@@ -35,6 +35,7 @@ Rozšíření která používáme:
     ├── senate          = app na web senat.pirati.cz
     ├── senat_campaign  = app na weby kandidátů na senátory
     ├── districts       = app na web kraje.pirati.cz
+    ├── program2021     = app na prezentaci programu 2021
     ...
     ├── majak           = Django projekt s konfigurací Majáku
     ├── shared          = app se sdílenými static soubory a templaty pro weby

majak/settings/base.py

@@ -36,6 +36,7 @@ INSTALLED_APPS = [
     "donate",
     "senat_campaign",
     "home",
+    "program2021",
     "shared",
     "calendar_utils",
     "users",

program2021/apps.py

+from django.apps import AppConfig
+
+
+class Program2021Config(AppConfig):
+    name = "program2021"

program2021/migrations/0001_initial.py

+# Generated by Django 3.0.8 on 2020-07-24 02:35
+
+import django.db.models.deletion
+import modelcluster.contrib.taggit
+import modelcluster.fields
+import wagtail.core.blocks
+import wagtail.core.fields
+import wagtail.images.blocks
+import wagtailmetadata.models
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    initial = True
+
+    dependencies = [
+        ("wagtailcore", "0045_assign_unlock_grouppagepermission"),
+        ("taggit", "0003_taggeditem_add_unique_index"),
+        ("wagtailimages", "0022_uploadedimage"),
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name="Program2021HomePage",
+            fields=[
+                (
+                    "page_ptr",
+                    models.OneToOneField(
+                        auto_created=True,
+                        on_delete=django.db.models.deletion.CASCADE,
+                        parent_link=True,
+                        primary_key=True,
+                        serialize=False,
+                        to="wagtailcore.Page",
+                    ),
+                ),
+            ],
+            options={"verbose_name": "Program 2021",},
+            bases=("wagtailcore.page",),
+        ),
+        migrations.CreateModel(
+            name="Program2021PointPage",
+            fields=[
+                (
+                    "page_ptr",
+                    models.OneToOneField(
+                        auto_created=True,
+                        on_delete=django.db.models.deletion.CASCADE,
+                        parent_link=True,
+                        primary_key=True,
+                        serialize=False,
+                        to="wagtailcore.Page",
+                    ),
+                ),
+                (
+                    "public_title",
+                    models.CharField(
+                        blank=True,
+                        help_text="Navrhují markeťáci. Max 46 znaků.",
+                        max_length=46,
+                        null=True,
+                        verbose_name="veřejný název",
+                    ),
+                ),
+                (
+                    "code",
+                    models.CharField(
+                        blank=True,
+                        help_text="Ideálně jedno nebo dvě slova ke krátkému neformálnímu označení tématu. Max 20 znaků.",
+                        max_length=20,
+                        null=True,
+                        verbose_name="kód",
+                    ),
+                ),
+                (
+                    "annotation",
+                    models.TextField(
+                        blank=True,
+                        help_text="Text anotace by měl jasně prezentovat přínos a být dostatečně konkrétní, a to i když konkrétní parametr může být předmětem podrobnějších analýz a diskuse. Anotace má až na výjimky obsahovat konkrétní číslo reprezentující rozsah problému nebo přínos jeho řešení (v tomto případě ušetření 4 miliard). Tato část bodu společně s veřejným názvem je schvalována republikovým výborem jako závazný program do voleb. Max 140 znaků.",
+                        max_length=140,
+                        null=True,
+                        verbose_name="anotace",
+                    ),
+                ),
+                (
+                    "problem",
+                    models.TextField(
+                        blank=True,
+                        help_text="Stručné vystižení podstaty problému ve vztahu k celé společnosti a klíčové cílové skupině. Může jít o budoucí hrozbu, náklady na odkládání či dosud nevyužitou příležitost. Max 280 znaků",
+                        max_length=280,
+                        null=True,
+                        verbose_name="problém",
+                    ),
+                ),
+                (
+                    "ideal",
+                    models.TextField(
+                        blank=True,
+                        help_text="Max 280 znaků.",
+                        max_length=280,
+                        null=True,
+                        verbose_name="ideál",
+                    ),
+                ),
+                (
+                    "benefits_self_employed",
+                    models.TextField(
+                        blank=True,
+                        help_text="Stručný popis dopadu na danou cílovou skupinu. Max 140 znaků.",
+                        max_length=250,
+                        null=True,
+                        verbose_name="benefity OSVČ",
+                    ),
+                ),
+                (
+                    "benefits_companies",
+                    models.TextField(
+                        blank=True,
+                        help_text="Stručný popis dopadu na danou cílovou skupinu. Max 140 znaků.",
+                        max_length=250,
+                        null=True,
+                        verbose_name="benefity firmy",
+                    ),
+                ),
+                (
+                    "benefits_public_money",
+                    models.TextField(
+                        blank=True,
+                        help_text="Rozpracuje tým finance. Úkolem finančního týmu není zpracovat to, ale dát k tomu metodiku a metodickou pomoc. V případě žádosti o pomoc se obracejte prosím na finančního analytika poslaneckého klubu Tomáše Kopečného. Max 140 znaků.",
+                        max_length=250,
+                        null=True,
+                        verbose_name="benefity veřejné finance",
+                    ),
+                ),
+                (
+                    "already_done",
+                    wagtail.core.fields.RichTextField(
+                        blank=True,
+                        help_text="Max 1800 znaků.",
+                        max_length=1800,
+                        null=True,
+                        verbose_name="co jsme už udělali",
+                    ),
+                ),
+                (
+                    "proposals",
+                    wagtail.core.fields.RichTextField(
+                        blank=True,
+                        help_text="Konkrétní (!) body specifikující náš postup v chronologickém pořadí. Max 1800 znaků.",
+                        max_length=1800,
+                        null=True,
+                        verbose_name="navrhovaná opatření",
+                    ),
+                ),
+                (
+                    "implementation_time",
+                    models.CharField(
+                        blank=True,
+                        help_text="Doba, po které se projekt převede do standardního procesního řízení a lze vyhodnotit přinášený efekt. Jde pouze o realizační fázi, nikoliv celý životní cyklus.",
+                        max_length=20,
+                        null=True,
+                        verbose_name="časový horizont realizace",
+                    ),
+                ),
+                (
+                    "faq",
+                    wagtail.core.fields.StreamField(
+                        [
+                            (
+                                "item",
+                                wagtail.core.blocks.StructBlock(
+                                    [
+                                        (
+                                            "question",
+                                            wagtail.core.blocks.CharBlock(
+                                                label="otázka"
+                                            ),
+                                        ),
+                                        (
+                                            "answer",
+                                            wagtail.core.blocks.TextBlock(
+                                                label="odpověď"
+                                            ),
+                                        ),
+                                    ],
+                                    label="dotaz",
+                                ),
+                            )
+                        ],
+                        blank=True,
+                        verbose_name="často kladené dotazy",
+                    ),
+                ),
+                (
+                    "sources",
+                    wagtail.core.fields.RichTextField(
+                        blank=True,
+                        help_text="Naše vlastní údaje (odhady), které nevycházejí přímo z renomovaného zdroje, dokládáme vlastními analýzami na dané téma, které jsou v seznamu zdrojů a měly by procházet externí oponenturou.",
+                        null=True,
+                        verbose_name="zdroje",
+                    ),
+                ),
+                (
+                    "related",
+                    wagtail.core.fields.StreamField(
+                        [
+                            (
+                                "point",
+                                wagtail.core.blocks.PageChooserBlock(
+                                    label="programový bod",
+                                    page_type=["program2021.Program2021PointPage"],
+                                ),
+                            )
+                        ],
+                        blank=True,
+                        verbose_name="související body",
+                    ),
+                ),
+                (
+                    "images",
+                    wagtail.core.fields.StreamField(
+                        [
+                            (
+                                "image",
+                                wagtail.images.blocks.ImageChooserBlock(
+                                    label="ilustrační obrázek"
+                                ),
+                            )
+                        ],
+                        blank=True,
+                        verbose_name="ilustrační obrázky",
+                    ),
+                ),
+                (
+                    "owner_name",
+                    models.TextField(
+                        blank=True,
+                        max_length=250,
+                        null=True,
+                        verbose_name="jméno garanta (zodpovědné osoby)",
+                    ),
+                ),
+                (
+                    "owner_url",
+                    models.URLField(
+                        blank=True, null=True, verbose_name="odkaz na garanta"
+                    ),
+                ),
+                (
+                    "search_image",
+                    models.ForeignKey(
+                        blank=True,
+                        null=True,
+                        on_delete=django.db.models.deletion.SET_NULL,
+                        related_name="+",
+                        to="wagtailimages.Image",
+                        verbose_name="Search image",
+                    ),
+                ),
+            ],
+            options={"verbose_name": "Programový bod",},
+            bases=(
+                "wagtailcore.page",
+                wagtailmetadata.models.MetadataMixin,
+                models.Model,
+            ),
+        ),
+        migrations.CreateModel(
+            name="Program2021PointPageTag",
+            fields=[
+                (
+                    "id",
+                    models.AutoField(
+                        auto_created=True,
+                        primary_key=True,
+                        serialize=False,
+                        verbose_name="ID",
+                    ),
+                ),
+                (
+                    "content_object",
+                    modelcluster.fields.ParentalKey(
+                        on_delete=django.db.models.deletion.CASCADE,
+                        to="program2021.Program2021PointPage",
+                    ),
+                ),
+                (
+                    "tag",
+                    models.ForeignKey(
+                        on_delete=django.db.models.deletion.CASCADE,
+                        related_name="program2021_program2021pointpagetag_items",
+                        to="taggit.Tag",
+                    ),
+                ),
+            ],
+            options={"abstract": False,},
+        ),
+        migrations.AddField(
+            model_name="program2021pointpage",
+            name="tags",
+            field=modelcluster.contrib.taggit.ClusterTaggableManager(
+                blank=True,
+                help_text="A comma-separated list of tags.",
+                through="program2021.Program2021PointPageTag",
+                to="taggit.Tag",
+                verbose_name="Tags",
+            ),
+        ),
+    ]

program2021/models.py

+from django.db import models
+from django.utils.translation import gettext_lazy
+from modelcluster.contrib.taggit import ClusterTaggableManager
+from modelcluster.fields import ParentalKey
+from taggit.models import TaggedItemBase
+from wagtail.admin.edit_handlers import (
+    FieldPanel,
+    HelpPanel,
+    MultiFieldPanel,
+    ObjectList,
+    StreamFieldPanel,
+    TabbedInterface,
+)
+from wagtail.core import blocks
+from wagtail.core.fields import RichTextField, StreamField
+from wagtail.core.models import Page
+from wagtail.images.blocks import ImageChooserBlock
+from wagtail.images.edit_handlers import ImageChooserPanel
+from wagtailmetadata.models import MetadataPageMixin
+
+
+class Program2021HomePage(Page):
+    ### FIELDS
+
+    ### PANELS
+
+    settings_panels = []
+
+    ### RELATIONS
+
+    subpage_types = ["program2021.Program2021PointPage"]
+
+    ### OTHERS
+
+    class Meta:
+        verbose_name = "Program 2021"
+
+    def get_context(self, request):
+        context = super().get_context(request)
+        context["points"] = self.get_children().live().specific()
+        return context
+
+
+class Program2021PointPageTag(TaggedItemBase):
+    content_object = ParentalKey(
+        "program2021.Program2021PointPage", on_delete=models.CASCADE
+    )
+
+
+class Program2021PointPage(Page, MetadataPageMixin):
+    RICH_TEXT_FEATURES = ["bold", "italic", "ol", "ul", "link", "document-link"]
+
+    ### FIELDS
+    public_title = models.CharField(
+        "veřejný název",
+        max_length=46,
+        blank=True,
+        null=True,
+        help_text="Navrhují markeťáci. Max 46 znaků.",
+    )
+    code = models.CharField(
+        "kód",
+        max_length=20,
+        blank=True,
+        null=True,
+        help_text="Ideálně jedno nebo dvě slova ke krátkému neformálnímu označení tématu. Max 20 znaků.",
+    )
+    annotation = models.TextField(
+        "anotace",
+        max_length=140,
+        blank=True,
+        null=True,
+        help_text="Text anotace by měl jasně prezentovat přínos a být dostatečně konkrétní, a to i když konkrétní parametr může být předmětem podrobnějších analýz a diskuse. Anotace má až na výjimky obsahovat konkrétní číslo reprezentující rozsah problému nebo přínos jeho řešení (v tomto případě ušetření 4 miliard). Tato část bodu společně s veřejným názvem je schvalována republikovým výborem jako závazný program do voleb. Max 140 znaků.",
+    )
+    problem = models.TextField(
+        "problém",
+        max_length=280,
+        blank=True,
+        null=True,
+        help_text="Stručné vystižení podstaty problému ve vztahu k celé společnosti a klíčové cílové skupině. Může jít o budoucí hrozbu, náklady na odkládání či dosud nevyužitou příležitost. Max 280 znaků",
+    )
+    ideal = models.TextField(
+        "ideál", max_length=280, blank=True, null=True, help_text="Max 280 znaků."
+    )
+    benefits_self_employed = models.TextField(
+        "benefity OSVČ",
+        max_length=250,
+        blank=True,
+        null=True,
+        help_text="Stručný popis dopadu na danou cílovou skupinu. Max 140 znaků.",
+    )
+    benefits_companies = models.TextField(
+        "benefity firmy",
+        max_length=250,
+        blank=True,
+        null=True,
+        help_text="Stručný popis dopadu na danou cílovou skupinu. Max 140 znaků.",
+    )
+    benefits_public_money = models.TextField(
+        "benefity veřejné finance",
+        max_length=250,
+        blank=True,
+        null=True,
+        help_text="Rozpracuje tým finance. Úkolem finančního týmu není zpracovat to, ale dát k tomu metodiku a metodickou pomoc. V případě žádosti o pomoc se obracejte prosím na finančního analytika poslaneckého klubu Tomáše Kopečného. Max 140 znaků.",
+    )
+    already_done = RichTextField(
+        "co jsme už udělali",
+        max_length=1800,
+        blank=True,
+        null=True,
+        help_text="Max 1800 znaků.",
+        features=RICH_TEXT_FEATURES,
+    )
+    proposals = RichTextField(
+        "navrhovaná opatření",
+        max_length=1800,
+        blank=True,
+        null=True,
+        help_text="Konkrétní (!) body specifikující náš postup v chronologickém pořadí. Max 1800 znaků.",
+        features=RICH_TEXT_FEATURES,
+    )
+    implementation_time = models.CharField(
+        "časový horizont realizace",
+        max_length=20,
+        blank=True,
+        null=True,
+        help_text="Doba, po které se projekt převede do standardního procesního řízení a lze vyhodnotit přinášený efekt. Jde pouze o realizační fázi, nikoliv celý životní cyklus.",
+    )
+    faq = StreamField(
+        [
+            (
+                "item",
+                blocks.StructBlock(
+                    [
+                        ("question", blocks.CharBlock(label="otázka")),
+                        ("answer", blocks.TextBlock(label="odpověď")),
+                    ],
+                    label="dotaz",
+                ),
+            ),
+        ],
+        verbose_name="často kladené dotazy",
+        blank=True,
+    )
+    sources = RichTextField(
+        "zdroje",
+        blank=True,
+        null=True,
+        help_text="Naše vlastní údaje (odhady), které nevycházejí přímo z renomovaného zdroje, dokládáme vlastními analýzami na dané téma, které jsou v seznamu zdrojů a měly by procházet externí oponenturou.",
+        features=RICH_TEXT_FEATURES,
+    )
+    related = StreamField(
+        [
+            (
+                "point",
+                blocks.PageChooserBlock(
+                    label="programový bod", page_type="program2021.Program2021PointPage"
+                ),
+            ),
+        ],
+        verbose_name="související body",
+        blank=True,
+    )
+    images = StreamField(
+        [("image", ImageChooserBlock(label="ilustrační obrázek"))],
+        verbose_name="ilustrační obrázky",
+        blank=True,
+    )
+    owner_name = models.TextField(
+        "jméno garanta (zodpovědné osoby)", max_length=250, blank=True, null=True
+    )
+    owner_url = models.URLField("odkaz na garanta", blank=True, null=True)
+    tags = ClusterTaggableManager(through=Program2021PointPageTag, blank=True)
+
+    ### PANELS
+
+    content_panels = Page.content_panels + [
+        MultiFieldPanel(
+            [
+                FieldPanel("public_title"),
+                FieldPanel("annotation"),
+                FieldPanel("tags"),
+                FieldPanel("problem"),
+                FieldPanel("ideal"),
+                FieldPanel("already_done"),
+                FieldPanel("proposals"),
+                FieldPanel("sources"),
+                FieldPanel("implementation_time"),
+                FieldPanel("code"),
+            ],
+            heading="základní informace",
+        ),
+        MultiFieldPanel(
+            [FieldPanel("owner_name"), FieldPanel("owner_url")], heading="garant",
+        ),
+        StreamFieldPanel("images"),
+        StreamFieldPanel("related"),
+    ]
+
+    benefits_content_panels = [
+        HelpPanel(
+            "V této části rozpracováváme benefity tak, abychom je mohli souhrnně nabídnout dané cílové skupině. Negativní věci zpracováváme typicky do často kladených otázek dole. U negativ se však vždy prezentuje i související přínos (tzv. balíčkovací zásada, např. snížíme daně z práce díky lepšímu zdanění zisků dnes vyváděných do zahraničí), aby nikdo nemohl takový bod vytrhnout z kontextu a prezentovat proti nám."
+        ),
+        MultiFieldPanel(
+            [
+                FieldPanel("benefits_self_employed"),
+                FieldPanel("benefits_companies"),
+                FieldPanel("benefits_public_money"),
+            ]
+        ),
+    ]
+
+    faq_content_panels = [
+        StreamFieldPanel("faq"),
+    ]
+
+    promote_panels = [
+        MultiFieldPanel(
+            [
+                FieldPanel("slug"),
+                FieldPanel("seo_title"),
+                FieldPanel("search_description"),
+                ImageChooserPanel("search_image"),
+            ],
+            gettext_lazy("Common page configuration"),
+        ),
+    ]
+
+    edit_handler = TabbedInterface(
+        [
+            ObjectList(content_panels, heading=gettext_lazy("Content")),
+            ObjectList(benefits_content_panels, heading="Benefity"),
+            ObjectList(faq_content_panels, heading="FAQ"),
+            ObjectList(promote_panels, heading=gettext_lazy("Promote")),
+        ]
+    )
+
+    ### RELATIONS
+
+    parent_page_types = ["program2021.Program2021HomePage"]
+    subpage_types = []
+
+    ### OTHERS
+
+    class Meta:
+        verbose_name = "Programový bod"

program2021/templates/program2021/base.html

+{% load static wagtailcore_tags wagtailmetadata_tags %}
+<!doctype html>
+<html lang="en">
+  <head>
+    <!-- Required meta tags -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
+    <!-- Bootstrap CSS -->
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
+
+    <title>Program 2021</title>
+
+    {% if settings.MAJAK_ENV == "test" %}
+      <meta name="robots" content="noindex, nofollow">
+    {% endif %}
+
+    <style type="text/css">
+      .card a {
+        text-decoration: none;
+        color: inherit;
+      }
+    </style>
+  </head>
+  <body>
+    <header>
+      <div class="navbar navbar-dark bg-dark shadow-sm">
+        <div class="container d-flex justify-content-between">
+          <a href="/" class="navbar-brand d-flex align-items-center">
+            <svg class="bi bi-file-earmark-check" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+              <path d="M9 1H4a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h5v-1H4a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h5v2.5A1.5 1.5 0 0 0 10.5 6H13v2h1V6L9 1z"/>
+              <path fill-rule="evenodd" d="M15.854 10.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 0 1 .708-.708l1.146 1.147 2.646-2.647a.5.5 0 0 1 .708 0z"/>
+            </svg>
+            <strong>&nbsp;Program 2021</strong>
+          </a>
+        </div>
+      </div>
+    </header>
+
+    <main role="main">
+
+      {% block content %}{% endblock %}
+
+    </main>
+
+    <!-- Optional JavaScript -->
+    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
+    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
+  </body>
+</html>

program2021/templates/program2021/program2021_home_page.html

+{% extends "program2021/base.html" %}
+{% load wagtailcore_tags %}
+{% block content %}
+
+<section class="jumbotron text-center">
+  <div class="container">
+    <h1>Povězte nám kdo jste?</h1>
+    <p class="lead text-muted">Zkuste nám říci, kdo jste a my vám nabídneme to nejzajímavější z našeho programu pro vás!</p>
+
+    <form class="text-left mt-5">
+
+      <div class="row my-3">
+        <div class="col-2 text-right">pohlaví:</div>
+        <div class="col-4 btn-group btn-group-toggle" data-toggle="buttons">
+          <label class="btn btn-outline-secondary">
+            <input type="radio" name="gender" id="gender1" autocomplete="off"> žena
+          </label>
+          <label class="btn btn-outline-secondary">
+            <input type="radio" name="gender" id="gender2" autocomplete="off"> muž
+          </label>
+          <label class="btn btn-outline-secondary active">
+            <input type="radio" name="gender" id="gender3" autocomplete="off" checked> jiné / nechci uvést
+          </label>
+        </div>
+      </div>
+
+      <div class="row my-3">
+        <div class="col-2 text-right">věk:</div>
+        <div class="col-6 btn-group btn-group-toggle" data-toggle="buttons">
+          <label class="btn btn-outline-secondary active">
+            <input type="radio" name="age" id="age1" autocomplete="off"> do 30 let
+          </label>
+          <label class="btn btn-outline-secondary">
+            <input type="radio" name="age" id="age2" autocomplete="off"> 30 - 49 let
+          </label>
+          <label class="btn btn-outline-secondary">
+            <input type="radio" name="age" id="age3" autocomplete="off"> 50 - 64 let
+          </label>
+          <label class="btn btn-outline-secondary">
+            <input type="radio" name="age" id="age4" autocomplete="off"> 65+ let
+          </label>
+          <label class="btn btn-outline-secondary">
+            <input type="radio" name="age" id="age5" autocomplete="off" checked> nechci uvést
+          </label>
+        </div>
+      </div>
+
+      <div class="row my-3">
+        <div class="col-2 text-right">mám děti:</div>
+        <div class="col-3 btn-group btn-group-toggle" data-toggle="buttons">
+          <label class="btn btn-outline-secondary">
+            <input type="radio" name="kids" id="kids1" autocomplete="off"> ano
+          </label>
+          <label class="btn btn-outline-secondary">
+            <input type="radio" name="kids" id="kids2" autocomplete="off"> ne
+          </label>
+          <label class="btn btn-outline-secondary active">
+            <input type="radio" name="kids" id="kids3" autocomplete="off" checked> nechci uvést
+          </label>
+        </div>
+      </div>
+
+      <div class="row form-group">
+        <div class="col-2 text-right">
+          <label for="occupation">jsem:</label>
+        </div>
+        <div class="col-4">
+          <select class="form-control" id="occupation">
+            <option>jiné / nechci uvést</option>
+            <option>student*ka</option>
+            <option>zaměstnanec*kyně ve veřejné sféře</option>
+            <option>zaměstnanec*kyně v soukromé sféře</option>
+            <option>podnikatel*ka</option>
+            <option>na mateřské / rodičovské</option>
+            <option>v důchodu</option>
+          </select>
+        </div>
+      </div>
+
+      <div class="row form-group">
+        <div class="col-2 text-right">
+          <label for="wealth">životní úroveň:</label>
+        </div>
+        <div class="col-4">
+          <select class="form-control" id="wealth">
+            <option>jiné / nechci uvést</option>
+            <option>velmi dobrá</option>
+            <option>dobrá</option>
+            <option>ani dobrá, ani špatná</option>
+            <option>špatná</option>
+          </select>
+        </div>
+      </div>
+
+      <div class="row form-group">
+        <div class="col-2 text-right">
+          často jezdím:
+        </div>
+        <div class="col-4">
+          <div class="custom-control custom-checkbox">
+            <input type="checkbox" class="custom-control-input" id="travel1">
+            <label class="custom-control-label" for="travel1">na kole</label>
+          </div>
+          <div class="custom-control custom-checkbox">
+            <input type="checkbox" class="custom-control-input" id="travel2">
+            <label class="custom-control-label" for="travel2">autem</label>
+          </div>
+          <div class="custom-control custom-checkbox">
+            <input type="checkbox" class="custom-control-input" id="travel3">
+            <label class="custom-control-label" for="travel3">veřejnou dopravou</label>
+          </div>
+        </div>
+      </div>
+
+      <div class="row form-group">
+        <div class="col-2 text-right">
+          <label for="housing">bydlím:</label>
+        </div>
+        <div class="col-4">
+          <select class="form-control" id="housing">
+            <option>jiné / nechci uvést</option>
+            <option>ve velkém městě nebo jeho okolí</option>
+            <option>ve středně velkém městě (10 - 50 tis.)</option>
+            <option>v malém městě nebo na vesnici</option>
+          </select>
+        </div>
+      </div>
+
+      <div class="row my-3">
+        <div class="col-2 text-right">vzdělání:</div>
+        <div class="col-6 btn-group btn-group-toggle" data-toggle="buttons">
+          <label class="btn btn-outline-secondary">
+            <input type="radio" name="education" id="education1" autocomplete="off"> ZŠ
+          </label>
+          <label class="btn btn-outline-secondary">
+            <input type="radio" name="education" id="education2" autocomplete="off"> SŠ bez maturity
+          </label>
+          <label class="btn btn-outline-secondary">
+            <input type="radio" name="education" id="education3" autocomplete="off"> SŠ s maturitou
+          </label>
+          <label class="btn btn-outline-secondary">
+            <input type="radio" name="education" id="education4" autocomplete="off"> VŠ
+          </label>
+          <label class="btn btn-outline-secondary active">
+            <input type="radio" name="education" id="education5" autocomplete="off" checked> nechci uvést
+          </label>
+        </div>
+      </div>
+
+    </form>
+
+  </div>
+</section>
+
+<div class="my-5">
+  <div class="container">
+    <div class="row">
+
+      {% for point in points %}
+      <div class="col-md-4">
+        <div class="card mb-4 shadow-sm">
+          <a href="{% pageurl point %}">
+            <div class="card-body">
+              <h5 class="card-title">{{ point.public_title }}</h5>
+              <p class="card-text">{{ point.annotation }}</p>
+              <p class="card-text">
+                {% for tag in point.tags.all %}
+                <span class="badge badge-light"># {{ tag }}</span>
+                {% endfor %}
+              </p>
+            </div>
+          </a>
+        </div>
+      </div>
+      {% endfor %}
+
+    </div>
+  </div>
+</div>
+
+{% endblock %}

program2021/templates/program2021/program2021_point_page.html

+{% extends "program2021/base.html" %}
+{% load wagtailcore_tags %}
+{% block content %}
+
+<div class="container">
+  <div class="row">
+
+    <div class="jumbotron mb-5">
+      <h1 class="display-4">{{ page.public_title }}</h1>
+      <p class="lead">{{ page.annotation }}</p>
+      <p class="mt-4 mb-0 text-right">
+        {% for tag in page.tags.all %}
+        <span class="badge badge-light"># {{ tag }}</span>
+        {% endfor %}
+      </p>
+    </div>
+
+    <div class="col-md-6 pr-5">
+      <h3>Problém</h3>
+      <p>{{ page.problem }}</p>
+    </div>
+
+    <div class="col-md-6 pl-5">
+      <h3>Ideál</h3>
+      <p>{{ page.ideal }}</p>
+    </div>
+
+    <div class="w-100 my-4"></div>
+
+    <div class="col-md-6 pr-5">
+      <h3>Navrhovaná opatření</h3>
+      <p>{{ page.proposals|richtext }}</p>
+    </div>
+
+    <div class="col-md-6 pl-5">
+      <h3>Co jsme už udělali</h3>
+      <p>{{ page.already_done|richtext }}</p>
+    </div>
+
+    <div class="w-100 my-4"></div>
+
+    <div class="col-md-6 pr-5">
+      <h3>Benefity</h3>
+      <h5 class="mt-4">OSVČ</h5>
+      <p>{{ page.benefits_self_employed }}</p>
+      <h5 class="mt-4">Firmy</h5>
+      <p>{{ page.benefits_companies }}</p>
+      <h5 class="mt-4">Veřejné finance</h5>
+      <p>{{ page.benefits_public_money }}</p>
+    </div>
+
+    <div class="col-md-6 pl-5">
+      <h3>Často kladené otázky</h3>
+      {% for qa in page.faq %}
+        <h5 class="mt-4">{{ qa.value.question }}</h5>
+        <p>{{ qa.value.answer }}</p>
+      {% endfor %}
+    </div>
+
+    <div class="w-100 my-4"></div>
+
+    <div class="col-md-6 pr-5">
+      <h3>Časový horizont</h3>
+      <p>{{ page.implementation_time }}</p>
+      <h3 class="mt-4">Související body</h3>
+      <ul>
+        {% for point in page.related %}
+        <li><a href="{% pageurl point.value %}">{{ point.value.title }}</a></li>
+        {% endfor %}
+      </ul>
+    </div>
+
+    <div class="col-md-6 pl-5">
+      <h3>Zdroje</h3>
+      <p>{{ page.sources|richtext }}</p>
+    </div>
+
+    <div class="w-100 my-4"></div>
+
+  </div>
+</div>
+
+{% endblock %}