Close menu

Pattern Library

<div class="bg-grey-180">
  <ul class="candidate-secondary-list pt-14 pb-16">
    <div class="container--wide">
      <h2 class="head-7xl mb-3">{{ heading }}</h2>
    </div>

    {% for candidate in candidates %}
      <li class="candidate-secondary-box container--wide">
        <a
          href="{{ candidate.url }}"
          class="
            py-2 flex gap-6 items-center underline-offset-2
          "
        >
          <div class="font-bold text-xl w-8">
            {{ candidate.number }}
          </div>

          <div
            class="
              flex grow-1 shrink-0 font-bold justify-center items-center rounded-full
            "
          >
            <img
              class="w-12 object-cover"
              src="{{ candidate.image_source }}"
            >
          </div>

          <div
            class="
              flex gap-2 flex-col
              
              lg:gap-6 lg:flex-row
            "
          >
            <h4
              class="text-xl font-bold w-64"
            >{{ candidate.name }}</h4>

            {% if candidate.position %}
              <p class="lg:ml-6">
                {{ candidate.position }}
              </p>
            {% endif %}

            {% if candidate.party_membership %}
              <div
                class="
                  font-bold flex items-center gap-1
                  
                  lg:ml-auto
                "
              >
                {% if candidate.party_membership == "Pirátská strana" %}
                  <img
                    class="w-8"
                    src="../../../../../static/images/logo-round-black.svg"
                  >
                {% endif %}

                {{ candidate.party_membership }}
              </div>
            {% endif %}
          </div>
        </a>
      </li>
    {% endfor %}
  </ul>
</div>
context:
  heading: 'Další kandidáti'
  candidates:
    -
      number: '1'
      name: 'Pepa Bohoušů'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '35 let, programátor automatizovaných výrobních linek, Slatiňany'
      party_membership: 'Pirátská strana'
    -
      number: '2'
      name: 'Jana Nováková'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '42 let, učitelka matematiky, Praha'
      party_membership: 'Pirátská strana'
    -
      number: '3'
      name: 'Tomáš Kovařík'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '39 let, inženýr v obnovitelných zdrojích energie, Brno'
      party_membership: 'Pirátská strana'
    -
      number: '4'
      name: 'Eva Malá'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '29 let, novinářka, Ostrava'
      party_membership: 'bez příslušnosti'
    -
      number: '5'
      name: 'Lukáš Novotný'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '38 let, podnikatel v oblasti IT, Plzeň'
      party_membership: 'Pirátská strana'
    -
      number: '6'
      name: 'Petra Dvořáková'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '45 let, lékařka, Liberec'
      party_membership: 'Pirátská strana'
    -
      number: '7'
      name: 'Martin Vacek'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '33 let, architekt, Olomouc'
      party_membership: 'Pirátská strana'
    -
      number: '8'
      name: 'Pepa Bohoušů'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '35 let, programátor automatizovaných výrobních linek, Slatiňany'
      party_membership: 'bez příslušnosti'
    -
      number: '9'
      name: 'Jana Nováková'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '42 let, učitelka matematiky, Praha'
      party_membership: 'Pirátská strana'
    -
      number: '10'
      name: 'Tomáš Kovařík'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '39 let, inženýr v obnovitelných zdrojích energie, Brno'
      party_membership: 'bez příslušnosti'
    -
      number: '11'
      name: 'Eva Malá'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '29 let, novinářka, Ostrava'
      party_membership: 'Pirátská strana'
    -
      number: '12'
      name: 'Lukáš Novotný'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '38 let, podnikatel v oblasti IT, Plzeň'
      party_membership: 'bez příslušnosti'
    -
      number: '13'
      name: 'Petra Dvořáková'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '45 let, lékařka, Liberec'
      party_membership: 'Pirátská strana'
    -
      number: '14'
      name: 'Martin Vacek'
      image_source: '../../../../../static/images/mikulas-inverse-arrow.png'
      position: '33 let, architekt, Olomouc'
      party_membership: 'bez příslušnosti'