{% include "@Components/sections/posts-section/posts-section.twig" with { props: {
title: "Články, rady, tipy a návody",
dropdown: {
variant: "small",
options: [
{
title: "Výchozí řazení",
selected: true
}, {
title: "Nejlépe hodnocené"
}, {
title: "Nejprve nejstarší"
}, {
title: "Nejprve nejnovější"
}
]
},
search_field: {
placeholder: "Hledat ve článkcích",
button:{
title: "Hledej"
}
},
posts: [
{
title: "Historická tvrz v Nových Královicích se dočkala rekonstrukce a vyvolala i zvýšený zájem o bydlení",
perex: "Třípatrová, dvacet metrů vysoká tvrz, stojí v Královicích pravděpodobně od začátku 13. století. Jako své sídelní místo ji s přilehlými dvorci postupně užívali majitelé panství.",
variant: "full",
img: {
src: "images/examples/tree-270x420.jpeg",
alt: "alt of image",
ratio: "3-2",
ratio_lg: "3-2",
isCover: true,
nativeLazyload: true,
sources: [{
srcset: "images/examples/tree-290x160.jpeg 1x,images/examples/building-580x320.jpeg/?giraffe 2x",
media: "(max-width: 991px)"
},{
srcset: "images/examples/tree-270x420.jpeg 1x,images/examples/giraffe-540x840.jpeg 2x",
media: "(min-width: 992px)"
}]},
url: "https://www.google.com/",
date: "26.3. 2021",
author: "Redakce",
ctaButton: {
tag: "button",
tooltip:"Do oblíbených",
icon: {
path: "images/svg/favorite.svg",
size: "",
color: ""
}
}
},
{
title: "Historická tvrz v Nových Královicích se dočkala rekonstrukce a vyvolala i zvýšený zájem o bydlení",
perex: "Třípatrová, dvacet metrů vysoká tvrz, stojí v Královicích pravděpodobně od začátku 13. století. Jako své sídelní místo ji s přilehlými dvorci postupně užívali majitelé panství.",
variant: "full",
img: {
src: "images/examples/tree-270x420.jpeg",
alt: "alt of image",
ratio: "3-2",
ratio_lg: "3-2",
isCover: true,
nativeLazyload: true,
sources: [{
srcset: "images/examples/tree-290x160.jpeg 1x,images/examples/building-580x320.jpeg/?giraffe 2x",
media: "(max-width: 991px)"
},{
srcset: "images/examples/tree-270x420.jpeg 1x,images/examples/giraffe-540x840.jpeg 2x",
media: "(min-width: 992px)"
}]},
url: "https://www.google.com/",
date: "26.3. 2021",
author: "Redakce",
ctaButton: {
tag: "button",
tooltip:"Do oblíbených",
icon: {
path: "images/svg/favorite.svg",
size: "",
color: ""
}
}
},
{
title: "Historická tvrz v Nových Královicích se dočkala rekonstrukce a vyvolala i zvýšený zájem o bydlení",
perex: "Třípatrová, dvacet metrů vysoká tvrz, stojí v Královicích pravděpodobně od začátku 13. století. Jako své sídelní místo ji s přilehlými dvorci postupně užívali majitelé panství.",
variant: "full",
img: {
src: "images/examples/tree-270x420.jpeg",
alt: "alt of image",
ratio: "3-2",
ratio_lg: "3-2",
isCover: true,
nativeLazyload: true,
sources: [{
srcset: "images/examples/tree-290x160.jpeg 1x,images/examples/building-580x320.jpeg/?giraffe 2x",
media: "(max-width: 991px)"
},{
srcset: "images/examples/tree-270x420.jpeg 1x,images/examples/giraffe-540x840.jpeg 2x",
media: "(min-width: 992px)"
}]},
url: "https://www.google.com/",
date: "26.3. 2021",
author: "Redakce",
ctaButton: {
tag: "button",
tooltip:"Do oblíbených",
icon: {
path: "images/svg/favorite.svg",
size: "",
color: ""
}
}
}
],
pagination_title: "nahoru",
pagination_color: "primary",
button_title_pagination: "Načíst další"
} } %}
<section class="base-section --spacing-md s-posts">
<div class="base-section__container container">
<header class="base-header --left">
<div class="base-header__heading-wrapper">
<h1 class="base-header__heading base-h1">Články, rady, tipy a návody</h1>
</div>
</header> <ul class="g-posts">
<li class="">
<article class="i-post-slide --full">
<div class="i-post-slide__image-col">
<div class="i-post-slide__image">
<a href="https://www.google.com/" class="i-post-slide-image-link u-img-hover">
<div class="img --ratio-3-2 --ratio-lg-3-2">
<picture>
<source srcset="images/examples/tree-290x160.jpeg 1x,images/examples/building-580x320.jpeg/?giraffe 2x" media="(max-width: 991px)">
<source srcset="images/examples/tree-270x420.jpeg 1x,images/examples/giraffe-540x840.jpeg 2x" media="(min-width: 992px)">
<img src="images/examples/tree-270x420.jpeg" alt="alt of image" loading="lazy" draggable="false">
</picture>
</div>
</a>
</div>
<div class="i-post-slide__cta-button">
<button class="cta-button --unlogged">
<div class="cta-button__wrapper">
<span class="icon">
<img src="images/svg/favorite.svg" loading="lazy">
</span>
</div>
<div class="tooltip">Do oblíbených</div>
</button>
</div>
</div>
<div class="i-post-slide__content-col">
<div class="i-post-slide__content">
<header class="i-post-slide__header">
<h2 class="i-post-slide__heading base-h2">
<a href="https://www.google.com/" title="Historická tvrz v Nových Královicích se dočkala rekonstrukce a vyvolala i zvýšený zájem o bydlení"
class="i-post-slide__heading-link">Historická tvrz v Nových Královicích se dočkala rekonstrukce a vyvolala i zvýšený zájem o bydlení</a>
</h2>
<div class="i-post-slide__origin">
<span class="i-post-slide__date">
26.3. 2021
</span>
<span>Redakce</span>
</div>
<p class="i-post-slide__perex">Třípatrová, dvacet metrů vysoká tvrz, stojí v Královicích pravděpodobně od začátku 13. století. Jako své sídelní místo ji s přilehlými dvorci postupně užívali majitelé panství.</p>
</header>
</div>
</div>
</article>
</li>
<li class="">
<article class="i-post-slide --full">
<div class="i-post-slide__image-col">
<div class="i-post-slide__image">
<a href="https://www.google.com/" class="i-post-slide-image-link u-img-hover">
<div class="img --ratio-3-2 --ratio-lg-3-2">
<picture>
<source srcset="images/examples/tree-290x160.jpeg 1x,images/examples/building-580x320.jpeg/?giraffe 2x" media="(max-width: 991px)">
<source srcset="images/examples/tree-270x420.jpeg 1x,images/examples/giraffe-540x840.jpeg 2x" media="(min-width: 992px)">
<img src="images/examples/tree-270x420.jpeg" alt="alt of image" loading="lazy" draggable="false">
</picture>
</div>
</a>
</div>
<div class="i-post-slide__cta-button">
<button class="cta-button --unlogged">
<div class="cta-button__wrapper">
<span class="icon">
<img src="images/svg/favorite.svg" loading="lazy">
</span>
</div>
<div class="tooltip">Do oblíbených</div>
</button>
</div>
</div>
<div class="i-post-slide__content-col">
<div class="i-post-slide__content">
<header class="i-post-slide__header">
<h2 class="i-post-slide__heading base-h2">
<a href="https://www.google.com/" title="Historická tvrz v Nových Královicích se dočkala rekonstrukce a vyvolala i zvýšený zájem o bydlení"
class="i-post-slide__heading-link">Historická tvrz v Nových Královicích se dočkala rekonstrukce a vyvolala i zvýšený zájem o bydlení</a>
</h2>
<div class="i-post-slide__origin">
<span class="i-post-slide__date">
26.3. 2021
</span>
<span>Redakce</span>
</div>
<p class="i-post-slide__perex">Třípatrová, dvacet metrů vysoká tvrz, stojí v Královicích pravděpodobně od začátku 13. století. Jako své sídelní místo ji s přilehlými dvorci postupně užívali majitelé panství.</p>
</header>
</div>
</div>
</article>
</li>
<li class="">
<article class="i-post-slide --full">
<div class="i-post-slide__image-col">
<div class="i-post-slide__image">
<a href="https://www.google.com/" class="i-post-slide-image-link u-img-hover">
<div class="img --ratio-3-2 --ratio-lg-3-2">
<picture>
<source srcset="images/examples/tree-290x160.jpeg 1x,images/examples/building-580x320.jpeg/?giraffe 2x" media="(max-width: 991px)">
<source srcset="images/examples/tree-270x420.jpeg 1x,images/examples/giraffe-540x840.jpeg 2x" media="(min-width: 992px)">
<img src="images/examples/tree-270x420.jpeg" alt="alt of image" loading="lazy" draggable="false">
</picture>
</div>
</a>
</div>
<div class="i-post-slide__cta-button">
<button class="cta-button --unlogged">
<div class="cta-button__wrapper">
<span class="icon">
<img src="images/svg/favorite.svg" loading="lazy">
</span>
</div>
<div class="tooltip">Do oblíbených</div>
</button>
</div>
</div>
<div class="i-post-slide__content-col">
<div class="i-post-slide__content">
<header class="i-post-slide__header">
<h2 class="i-post-slide__heading base-h2">
<a href="https://www.google.com/" title="Historická tvrz v Nových Královicích se dočkala rekonstrukce a vyvolala i zvýšený zájem o bydlení"
class="i-post-slide__heading-link">Historická tvrz v Nových Královicích se dočkala rekonstrukce a vyvolala i zvýšený zájem o bydlení</a>
</h2>
<div class="i-post-slide__origin">
<span class="i-post-slide__date">
26.3. 2021
</span>
<span>Redakce</span>
</div>
<p class="i-post-slide__perex">Třípatrová, dvacet metrů vysoká tvrz, stojí v Královicích pravděpodobně od začátku 13. století. Jako své sídelní místo ji s přilehlými dvorci postupně užívali majitelé panství.</p>
</header>
</div>
</div>
</article>
</li>
</ul>
<div class="g-pagination__wrapper">
<a class="link --primary --icon-before --animation-zoom" href="#">
<span class="link__title">
<span class="link__title-wrap">nahoru</span>
</span>
<span class="link__icon ">
<span class="icon --sm">
<img src="images/svg/arrow-down.svg" loading="lazy">
</span>
</span>
</a>
<ul class="pagination">
<li>
<a class="pagination-arrow --disabled --previous"" href="#">
<span class="icon">
<img src="images/svg/arrow-small-right.svg" loading="lazy">
</span>
</a>
</li>
<li>
<div class="i-pagination__wrapper ">
<a href="#" class="i-pagination">
<span>1</span>
</a>
</div>
</li>
<li>
<div class="i-pagination__wrapper options">
<label class="i-pagination" for="idecko">...</label>
<div class="form-control i-pagination__select" id="idecko">
<a href="#">50</a>
<a href="#">51</a>
<a href="#">52</a>
<a href="#">53</a>
<a href="#">54</a>
<a href="#">55</a>
<a href="#">56</a>
</div>
</div>
</li>
<li>
<div class="i-pagination__wrapper ">
<a href="#" class="i-pagination">
<span>3</span>
</a>
</div>
</li>
<li>
<div class="i-pagination__wrapper ">
<a href="#" class="i-pagination --active">
<span>4</span>
</a>
</div>
</li>
<li>
<div class="i-pagination__wrapper ">
<a href="#" class="i-pagination">
<span>5</span>
</a>
</div>
</li>
<li>
<a class="pagination-arrow --next" href="#">
<span class="icon">
<img src="images/svg/arrow-small-right.svg" loading="lazy">
</span>
</a>
</li>
</ul> </div>
<div class="g-pagination__button">
<a class="btn --conversion" href='#'> <span class="btn__title ">Načíst další</span>
</a>
</div>
</div>
</section>
