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,9 +7,23 @@
   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' %}
 
+      <div
+        class="
+          flex gap-12 flex-nowrap flex-col
+
+          lg:flex-row
+        "
+      >
+        <img
+          class="rounded-full w-52 h-52"
+          src="../../../../../static/images/person-table.png"
+          alt="Profilový obrázek"
+        >
+
+        <div class="flex flex-col">
           <span
             class="
               text-xl font-alt
@@ -18,7 +32,7 @@
           >{{ degree_before }}</span>
 
           <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>
+            <h1 class="font-alt text-6xl xl:text-9xl grow xl:grow-0">{{ name }}</h1>
 
             <span class="text-2xl xl:text-4xl">
               <span class="hidden xl:inline">, </span>{{ degree_after }}
@@ -60,7 +74,10 @@
                 {{ other_party_name }}
               </div>
             {% endif %}
+            </div>
+          </div>
+        </div>
       </span>
-    </h1>
+    </div>
   </div>
 </header>