add profile image

majak_uistyleguide/templates/patterns/atoms/lists/image_list_item.html

+<li class="flex gap-2 items-center">
+  <img
+    width="30"
+    height="30"
+    src="{{ image_src }}"
+  >
+  <div>
+    {{ text }}
+  </div>
+</li>
\ No newline at end of file

majak_uistyleguide/templates/patterns/atoms/lists/image_list_item.yaml

+context:
+  image_src: '/static/images/person-table.png'
+  text: 'Lorem ipsum dolor sit amet'
\ No newline at end of file

majak_uistyleguide/templates/patterns/atoms/text/two_columns_richtext.html

 <div
   class="
-    flex gap-6 w-full flex-col
+    flex gap-4 w-full flex-col
     lg:flex-row
   "
 >

majak_uistyleguide/templates/patterns/molecules/lists/image_list.html

+<ul class="flex flex-col gap-2">
+  {% include "patterns/atoms/lists/image_list_item.html" %}
+  {% include "patterns/atoms/lists/image_list_item.html" %}
+  {% include "patterns/atoms/lists/image_list_item.html" %}
+  {% include "patterns/atoms/lists/image_list_item.html" %}
+  {% include "patterns/atoms/lists/image_list_item.html" %}
+</ul>
\ No newline at end of file

majak_uistyleguide/templates/patterns/organisms/header/district/photo_header.html

@@ -7,60 +7,77 @@
   style="background-image: url('../../../../../static/images/background-images/bg-bartos.jpg')"
 >
   <div class="container--wide w-full">
-    <h1 class="text-white flex flex-col">
+    <div class="text-white flex flex-col">
       {% include 'patterns/atoms/header/navigation.html' with classes='mb-10' first_text='Lidé' second_text='Sněmovna' %}
 
-      <span
+      <div
         class="
-          text-xl font-alt
-          sm:text-4xl
+          flex gap-12 flex-nowrap flex-col
+
+          lg:flex-row
         "
-      >{{ degree_before }}</span>
+      >
+        <img
+          class="rounded-full w-52 h-52"
+          src="../../../../../static/images/person-table.png"
+          alt="Profilový obrázek"
+        >
 
-      <div class="flex items-baseline flex-col xl:flex-row font-alt">
-        <span class="font-alt text-6xl xl:text-9xl grow xl:grow-0">{{ name }}</span>
+        <div class="flex flex-col">
+          <span
+            class="
+              text-xl font-alt
+              sm:text-4xl
+            "
+          >{{ degree_before }}</span>
 
-        <span class="text-2xl xl:text-4xl">
-          <span class="hidden xl:inline">, </span>{{ degree_after }}
-        </span>
-      </div>
+          <div class="flex items-baseline flex-col xl:flex-row font-alt">
+            <h1 class="font-alt text-6xl xl:text-9xl grow xl:grow-0">{{ name }}</h1>
 
-      <span
-        class="
-          text-lg font-bold mt-8
-          xl:mt-[-0.7rem]
-        "
-      >{{ function }}</span>
+            <span class="text-2xl xl:text-4xl">
+              <span class="hidden xl:inline">, </span>{{ degree_after }}
+            </span>
+          </div>
 
-      <span
-        class="
-          text-lg font-bold mt-8
-        "
-      >
-        {% if is_pirate %}
-          <div class="flex gap-3 items-center">
-            <img
-              src="../../../../../static/images/badge.png"
-              alt="Logo Pirátské strany"
-              width="35"
-              height="35"
-            >
+          <span
+            class="
+              text-lg font-bold mt-8
+              xl:mt-[-0.7rem]
+            "
+          >{{ function }}</span>
 
-            Člen(ka) Pirátské strany
-          </div>
-        {% else %}
-          <div class="flex gap-3 items-center">
-            <img
-              src="../../../../../static/images/badge_other.png"
-              alt="Logo strany '{{ other_party_name }}'"
-              width="35"
-              height="35"
-            >
+          <span
+            class="
+              text-lg font-bold mt-8
+            "
+          >
+            {% if is_pirate %}
+              <div class="flex gap-3 items-center">
+                <img
+                  src="../../../../../static/images/badge.png"
+                  alt="Logo Pirátské strany"
+                  width="35"
+                  height="35"
+                >
+
+                Člen(ka) Pirátské strany
+              </div>
+            {% else %}
+              <div class="flex gap-3 items-center">
+                <img
+                  src="../../../../../static/images/badge_other.png"
+                  alt="Logo strany '{{ other_party_name }}'"
+                  width="35"
+                  height="35"
+                >
 
-            {{ other_party_name }}
+                {{ other_party_name }}
+              </div>
+            {% endif %}
+            </div>
           </div>
-        {% endif %}
+        </div>
       </span>
-    </h1>
+    </div>
   </div>
 </header>