[FIX]

Kontakt block - Další kontakty

main/styleguide/source/_patterns/molecules/blocks/contact-person-box.mustache

-<div class="flex person-box">
+<div class="flex max-w-sm">
   <div class="mr-2 sm:mr-7">
     <img class="rounded-full shadow-sm w-20 sm:w-40" src="https://randomuser.me/api/portraits/women/26.jpg"
          alt="user image">

main/styleguide/source/_patterns/templates/contact.mustache

@@ -4,7 +4,7 @@
 
 <main role="main">
     <section class="grid-container no-max mb-4 xl:mb-20">
-      <div class="grid-content-with-right-side flex flex-wrap">
+      <div class="grid-content-with-right-side flex flex-wrap justify-center xl:justify-start">
       <div class="w-full max-w-xl mb-10 xl:mb-20">
         <h2 class="head-4xl mb-5">
           Kontakty pro veřejnost
@@ -81,7 +81,7 @@
       <h2 class="head-4xl mb-5">
         Kontakty pro média
       </h2>
-      <div class="flex flex-wrap gap-4">
+      <div class="flex flex-wrap gap-4 justify-center xl:justify-start">
         {{> molecules-contact-person-box }}
         {{> molecules-contact-person-box }}
         {{> molecules-contact-person-box }}

main/styleguide/source/css/atoms/extra_sizing.pcss

@@ -7,10 +7,6 @@
   width: 100%;
 }
 
-.person-box {
-  width: 520px;
-}
-
 .person-box-big {
   max-width: 575px;
   width: 100%;

main/templates/main/includes/button_animated.html

 <a href="{{ btn_link }}" class="btn btn__slide__wrap {{ extra_classes }}">
-  <span class="btn text-lg bg-black text-white px-1 lg:text-base">
+  <span class="btn text-base bg-black text-white px-1">
     {{ btn_text | default_if_none:"Číst dále" }}
   </span>
-  <span class="btn text-lg bg-white text-black px-1 lg:text-base">
+  <span class="btn text-base bg-white text-black px-1">
     {{ btn_text | default_if_none:"Číst dále" }}
   </span>
 </a>

main/templates/main/main_contact_page.html

@@ -6,7 +6,7 @@
 
   <main role="main">
     <section class="grid-container no-max mb-4 xl:mb-20">
-      <div class="grid-content-with-right-side flex flex-wrap">
+      <div class="grid-content-with-right-side flex justify-center xl:justify-start flex-wrap">
         {% if page.text %}
           <div class="w-full max-w-xl mb-10 xl:mb-20">
 
@@ -69,9 +69,9 @@
           <h2 class="head-4xl mb-5">
             Kontakty pro média
           </h2>
-          <div class="flex flex-wrap gap-4">
+          <div class="flex flex-wrap gap-4 justify-center xl:justify-start">
             {% for contact_person_box in page.contact_people %}
-              <div class="flex person-box">
+              <div class="flex max-w-sm">
                 <div class="mr-2 sm:mr-7">
                   {% image contact_person_box.value.person.profile_image fill-250x250 as profile_image %}
                   <img class="rounded-full shadow-sm w-20 sm:w-40" src="{{ profile_image.url }}"