more adaptable person_page layout

main/templates/main/includes/organisms/header/photo_header.html

@@ -5,10 +5,18 @@
 <header
   class="
     flex items-center mb-4 w-full pt-96 pb-16
-    bg-no-repeat bg-cover bg-center bg-blend-darken bg-[top_right_-7rem] bg-[#00000088]
+    bg-no-repeat bg-cover bg-center bg-blend-darken bg-[top_right_-7rem]
+
+    {% if background_image %}
+      bg-[#00000088]
+    {% endif %}
+
     xl:mb-20 xl:bg-center xl:py-52
   "
+
+  {% if background_image %}
     style="background-image:url('{{ background_image.url }}')"
+  {% endif %}
 >
   <div class="container--wide w-full">
     <h1 class="text-white flex flex-col">
@@ -16,6 +24,7 @@
 
       {% include 'main/includes/atoms/header/navigation.html' with classes='mb-10' first_text=first_nav_text second_text=actual_second_nav_text first_link=first_nav_link %}
 
+      {% if degree_before %}
         <span
           class="
             text-xl font-alt
@@ -24,21 +33,26 @@
         >
           {{ degree_before }}
         </span>
+      {% endif %}
 
       <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>
 
+        {% if degree_after %}
           <span class="text-2xl xl:text-4xl">
             <span class="hidden xl:inline">, </span>{{ degree_after }}
           </span>
+        {% endif %}
       </div>
 
+      {% if function %}
         <span
           class="
             text-lg font-bold mt-8
             xl:mt-[-0.7rem]
           "
         >{{ function }}</span>
+      {% endif %}
     </h1>
   </div>
 </header>

main/templates/main/main_person_page.html

@@ -34,7 +34,7 @@
             >Kontakty</h3>
           </div>
 
-          <div class="flex flex-col gap-2 text-lg">
+          <div class="flex flex-col gap-2 text-lg mb-12">
             {% if page.phone %}
               <a href="tel:{{ page.phone }}" class="font-bold underline">
                 {{ page.phone }}