diff --git a/majak_uistyleguide/templates/patterns/organisms/candidates/candidate_secondary_list.html b/majak_uistyleguide/templates/patterns/organisms/candidates/candidate_secondary_list.html index 8a02bb72e49a32ada7b173aff62d857ec38ff8fa..143b300f90182185682233c4e9c6d28c5855a9a9 100644 --- a/majak_uistyleguide/templates/patterns/organisms/candidates/candidate_secondary_list.html +++ b/majak_uistyleguide/templates/patterns/organisms/candidates/candidate_secondary_list.html @@ -18,7 +18,7 @@ <div class=" - flex font-bold justify-center items-center rounded-full + flex grow-1 shrink-0 font-bold justify-center items-center rounded-full " > <img @@ -27,28 +27,42 @@ > </div> - <h4 - class="text-xl font-bold w-64" - >{{ candidate.name }}</h4> + <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="ml-6"> - {{ candidate.position }} - </p> - {% endif %} + {% if candidate.position %} + <p class="lg:ml-6"> + {{ candidate.position }} + </p> + {% endif %} - {% if candidate.party_membership %} - <div class="ml-auto font-bold flex items-center gap-1"> - {% if candidate.party_membership == "Pirátská strana" %} - <img - class="w-8" - src="../../../../../static/images/logo-round-black.svg" - > - {% 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 %} + {{ candidate.party_membership }} + </div> + {% endif %} + </div> </a> </li> {% endfor %}