diff --git a/main/styleguide/source/_patterns/atoms/form-fields/form-checkbox.mustache b/main/styleguide/source/_patterns/atoms/form-fields/form-checkbox.mustache index ba16df74bb7aee64994a01249f064f016def1dab..289cdd3273e00158757cb2059c4362b5b4826c48 100644 --- a/main/styleguide/source/_patterns/atoms/form-fields/form-checkbox.mustache +++ b/main/styleguide/source/_patterns/atoms/form-fields/form-checkbox.mustache @@ -1,4 +1,4 @@ -<div class="checkbox form-field__control {{ classes }}"> +<div class="checkbox form-field__control flex items-center {{ classes }}"> <input type="checkbox" id="checkbox_1" {{# disabled }}disabled{{/ disabled }} {{# readonly }}readonly{{/ readonly }}> - <label class="text-xs font-bold" for="checkbox_1">{{ label }}</label> + <label class="text-xs font-alt font-light" for="checkbox_1">{{ label }}</label> </div> diff --git a/main/styleguide/source/_patterns/atoms/form-fields/form-input.mustache b/main/styleguide/source/_patterns/atoms/form-fields/form-input.mustache index 2cb74d99b3dcbacac1b82220678c0454efeba237..d6e09736790c6df208e7e2c5cd3826aa8b6c6790 100644 --- a/main/styleguide/source/_patterns/atoms/form-fields/form-input.mustache +++ b/main/styleguide/source/_patterns/atoms/form-fields/form-input.mustache @@ -1 +1 @@ -<input type="text" class="text-input form-field__control {{ classes }}" value="" placeholder="{{ placeholder }}{{^ placeholder }}{{ form.placeholder }}{{/ placeholder }}" {{# disabled }}disabled{{/ disabled }} {{# readonly }}readonly{{/ readonly }} /> +<input type="text" class="text-input bg-white form-field__control {{ classes }}" value="" placeholder="{{ placeholder }}{{^ placeholder }}{{ form.placeholder }}{{/ placeholder }}" {{# disabled }}disabled{{/ disabled }} {{# readonly }}readonly{{/ readonly }} /> diff --git a/main/styleguide/source/_patterns/organisms/newsletter-section.mustache b/main/styleguide/source/_patterns/organisms/newsletter-section.mustache index b7bbc28bd22c96c6fb5f1369a3b19ab2d4a88bbb..cd3054fd05bbb3a8dd31321377dbd482c319258a 100644 --- a/main/styleguide/source/_patterns/organisms/newsletter-section.mustache +++ b/main/styleguide/source/_patterns/organisms/newsletter-section.mustache @@ -1,20 +1,18 @@ -<div class="section-clip bg-cover bg-no-repeat flex py-16 lg:py-36" - style="background-image: url('https://images.pexels.com/photos/3073681/pexels-photo-3073681.jpeg')"> - <div class="grid-container items-center px-4"> - <div class="grid-full flex flex-col"> - <div class="flex space-x-3 mb-4"> - <i class="ico--anchor text-7xl xl:text-9xl mb-4 xl:w-1/4"></i> - <h5 class="uppercase mt-4 head-alt-md xl:head-alt-lg">Odebírej náš <br> newsletter</h5> - </div> - <div class="flex xl:space-x-3 flex-wrap flex-col xl:flex-row"> - <span class="uppercase text-sm xl:text-base font-bold mb-2 xl:w-1/4"> +<div class="section-clip bg-cover bg-no-repeat flex pb-32 xl:pb-0 xl:h-screen relative z-10"> + <img src="../../images/background-images/bg-bartos-newsletter.jpg" alt="" class="absolute h-full w-full object-cover"> + <div class="grid-container mt-20 xl:mt-0 xl:items-center z-10"> + <div class="grid-full flex flex-col xl:flex-row"> + <div class="flex xl:flex-col items-center mb-4 xl:items-start xl:w-1/4"> + <i class="ico--anchor mr-2 text-7xl xl:mr-0 xl:text-9xl xl:mb-4 xl:w-full"></i> + <span class="uppercase text-xl xl:text-base font-bold mb-2 xl:w-full"> Fake news tam nenajdeš, ale dozvíš se co chystáme doopravdy! </span> - <div class=""> - {{> atoms-form-input(placeholder: "Tvůj email", classes: "mb-3 w-full") }} - {{> atoms-form-checkbox(label: "Souhlasím se zpracováním osobních údajů", classes: "mb-3") }} - {{> atoms-button-animated(btn-text: "Odebírat") }} - </div> + </div> + <div class="flex flex-col items-start"> + <h5 class="font-alt text-6xl xl:text-7xl uppercase">Odebírej náš <br> newsletter</h5> + {{> atoms-form-input(placeholder: "Tvůj email", classes: "mb-3 w-full") }} + {{> atoms-form-checkbox(label: "Souhlasím se zpracováním osobních údajů", classes: "mb-3") }} + {{> atoms-button-animated(btn-text: "Odebírat") }} </div> </div> </div> diff --git a/main/styleguide/source/images/background-images/bg-bartos-newsletter.jpg b/main/styleguide/source/images/background-images/bg-bartos-newsletter.jpg new file mode 100644 index 0000000000000000000000000000000000000000..d152c083c45ed8c76388779c4064fec23a554ece Binary files /dev/null and b/main/styleguide/source/images/background-images/bg-bartos-newsletter.jpg differ