diff --git a/source/_patterns/01-molecules/sharebox/sharebox.mustache b/source/_patterns/01-molecules/sharebox/sharebox.mustache index ec28f5f3c80b190efd4d64bd1ad110d6e8e912d2..f07880240b978e542cb092d15c1c1d8111d30eb2 100644 --- a/source/_patterns/01-molecules/sharebox/sharebox.mustache +++ b/source/_patterns/01-molecules/sharebox/sharebox.mustache @@ -1,13 +1,13 @@ <div class="sharebox card elevation-10 {{ classes }}"> <div class="card__body p-8"> - <span class="head-alt-md">SdĂlenĂ je aktem lásky</span> + <span class="head-alt-base md:head-alt-md">SdĂlenĂ je aktem lásky</span> - <div class="flex w-full space-x-4 pt-8 text-center text-white"> - <a href="#" class="bg-brands-facebook px-8 py-4 text-xl w-full"><i class="fab fa-facebook-f"></i></a> - <a href="#" class="bg-brands-twitter px-8 py-4 text-xl w-full"><i class="fab fa-twitter"></i></a> + <div class="flex w-full space-x-4 pt-4 md:pt-8 text-center text-white"> + <a href="#" class="bg-brands-facebook px-8 py-3 text-2xl w-full"><i class="fab fa-facebook-f"></i></a> + <a href="#" class="bg-brands-twitter px-8 py-3 text-2xl w-full"><i class="fab fa-twitter"></i></a> </div> </div> - <div class="h-52 overflow-hidden"> + <div class="h-52 overflow-hidden hidden md:block"> <img src="/images/flag.png" alt="Pirátská strana" class="w-80 object-cover m-auto" /> </div> </div> diff --git a/source/_patterns/02-organisms/02-articles/article-card-list.mustache b/source/_patterns/02-organisms/02-articles/article-card-list.mustache index b8dcdc0a4263b73868ca61599097bc7027c7f9d7..34a906050d60eb79eef45e0db6edae38a99f2669 100644 --- a/source/_patterns/02-organisms/02-articles/article-card-list.mustache +++ b/source/_patterns/02-organisms/02-articles/article-card-list.mustache @@ -2,7 +2,9 @@ {{> molecules-emphasized-article-card }} {{> molecules-article-card }} {{> molecules-emphasized-article-card }} + {{^ onlyThree }} {{> molecules-article-card }} {{> molecules-emphasized-article-card }} {{> molecules-article-card }} + {{/ onlyThree }} </div> diff --git a/source/_patterns/03-templates/article-detail.mustache b/source/_patterns/03-templates/article-detail.mustache index 06997cfb42f28da81393cee39332b137ba8756b4..51861399052871424d989e488718bd541681badc 100644 --- a/source/_patterns/03-templates/article-detail.mustache +++ b/source/_patterns/03-templates/article-detail.mustache @@ -1,9 +1,9 @@ {{> organisms-header }} -<div class="container container--default py-24"> +<div class="container container--default py-8 lg:py-24"> <article> - <h1 class="head-alt-lg max-w-5xl mb-4">Senátor Lukáš Wagenknecht žádá nastavenĂ pravidel proti stĹ™etu zájmĹŻ</h1> - <div class="flex items-center"> + <h1 class="head-alt-md md:head-alt-lg max-w-5xl mb-4">Senátor Lukáš Wagenknecht žádá nastavenĂ pravidel proti stĹ™etu zájmĹŻ</h1> + <div class="flex flex-col md:flex-row md:items-center"> <div class="inline-flex divide-x flex-grow"> <span class="pr-2">{{ dateverbose }}</span> <span class="pl-2">{{ organization.name }}</span> @@ -15,19 +15,19 @@ </div> {{> atoms-figure(caption: "Popisek fotky") }} - <div class="flex mt-8 space-x-8"> - <div class="w-2/3"> + <div class="lg:flex mt-8 lg:space-x-8"> + <div class="lg:w-2/3"> {{> molecules-content-block(classes: "w-full", noStartHeadline: true) }} </div> - <div class="w-1/3"> + <div class="pt-8 lg:w-1/3 md:pt-0"> {{> molecules-sharebox }} </div> </div> </article> - <section class="mt-24"> - <h1 class="head-alt-md pb-4">Dalšà podobnĂ© ÄŤlánky</h1> - {{> organisms-article-card-list }} + <section class="mt-16 md:mt-24"> + <h1 class="head-alt-base md:head-alt-md pb-4">Dalšà podobnĂ© ÄŤlánky</h1> + {{> organisms-article-card-list(onlyThree: true) }} <div class="text-center mt-8"> {{> atoms-icon-button(cta: "Zobrazit dalšĂ", classes: "text-xl", icon: "fas fa-chevron-right") }} </div>