{% set company_references_section = {
spacing: "none",
references: [
{
company: {
name: "Zbozí.cz",
logo: {
src: "https://i.imgur.com/4BQfW46.png"
}
},
rating: 4.9,
rating_percentage: 98,
rating_text: 'Spokojených zákazníků z 13 182 <a href="#">recenzí</a>'
},
{
company: {
name: "Google",
logo: {
src: "https://i.imgur.com/1N8Nlv0.png"
}
},
rating: 4.9,
rating_percentage: 98,
rating_text: 'Spokojených zákazníků z 13 182 <a href="#">recenzí</a>'
}
]
} %}
{% include "@Components/sections/company-references-section/company-references-section.twig" with {props: company_references_section} %}
<section class="base-section --none s-company-references">
<div class="base-section__container container">
<div class="g-references row gx-2 gy-2">
<div class="col-lg-6">
<div class="i-company-reference p-1 d-flex gap-2 gap-lg-5 flex-column flex-sm-row u-border u-border--tertiary-500 u-rounded-3">
<div class="i-company-reference__img-wrapper u-rounded-2 u-bg-tertiary-300 px-2 d-flex align-items-center justify-content-center">
<div class="img u-posr overflow-hidden --ratio-1-1 d-flex align-items-center">
<picture>
<img src="https://i.imgur.com/4BQfW46.png" alt="Zbozí.cz" width="120" height="120" loading="lazy" draggable="false">
</picture>
</div>
</div>
<div class="d-flex flex-column justify-content-center">
<div class="i-rating-item d-flex gap-2 align-items-center flex-wrap mb-2">
<h3 class="base-heading mb-0 u-fw-700 u-h2 u-fw-800">
4.9
</h3>
<div class="i-rating__stars d-flex column-gap-1">
<span class="icon d-flex align-items-center justify-content-center --lg i-rating__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><g clip-path="url(#clip0_3547_90711)"><path fill="#FACA9D" d="m24 9.346-8.306-1.183L12 .827 8.306 8.163 0 9.346l6.012 5.744-1.414 8.083L12 19.358l7.402 3.815-1.414-8.083L24 9.346Z"/></g><defs><clipPath id="clip0_3547_90711"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></svg> </span>
<span class="icon d-flex align-items-center justify-content-center --lg i-rating__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><g clip-path="url(#clip0_3547_90711)"><path fill="#FACA9D" d="m24 9.346-8.306-1.183L12 .827 8.306 8.163 0 9.346l6.012 5.744-1.414 8.083L12 19.358l7.402 3.815-1.414-8.083L24 9.346Z"/></g><defs><clipPath id="clip0_3547_90711"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></svg> </span>
<span class="icon d-flex align-items-center justify-content-center --lg i-rating__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><g clip-path="url(#clip0_3547_90711)"><path fill="#FACA9D" d="m24 9.346-8.306-1.183L12 .827 8.306 8.163 0 9.346l6.012 5.744-1.414 8.083L12 19.358l7.402 3.815-1.414-8.083L24 9.346Z"/></g><defs><clipPath id="clip0_3547_90711"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></svg> </span>
<span class="icon d-flex align-items-center justify-content-center --lg i-rating__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><g clip-path="url(#clip0_3547_90711)"><path fill="#FACA9D" d="m24 9.346-8.306-1.183L12 .827 8.306 8.163 0 9.346l6.012 5.744-1.414 8.083L12 19.358l7.402 3.815-1.414-8.083L24 9.346Z"/></g><defs><clipPath id="clip0_3547_90711"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></svg> </span>
<span class="icon d-flex align-items-center justify-content-center --lg i-rating__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><g clip-path="url(#clip0_3547_90711)"><path fill="#FACA9D" d="m24 9.346-8.306-1.183L12 .827 8.306 8.163 0 9.346l6.012 5.744-1.414 8.083L12 19.358l7.402 3.815-1.414-8.083L24 9.346Z"/></g><defs><clipPath id="clip0_3547_90711"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></svg> </span>
</div>
</div>
<div class="d-flex gap-1 align-items-center flex-wrap">
<div class="i-company-reference__percentage px-1 u-bg-tertiary-400 text-nowrap u-fw-700 u-fz-sm">98%</div>
<div class="i-company-reference__text u-fw-500">
Spokojených zákazníků z 13 182 <a href="#">recenzí</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="i-company-reference p-1 d-flex gap-2 gap-lg-5 flex-column flex-sm-row u-border u-border--tertiary-500 u-rounded-3">
<div class="i-company-reference__img-wrapper u-rounded-2 u-bg-tertiary-300 px-2 d-flex align-items-center justify-content-center">
<div class="img u-posr overflow-hidden --ratio-1-1 d-flex align-items-center">
<picture>
<img src="https://i.imgur.com/1N8Nlv0.png" alt="Google" width="120" height="120" loading="lazy" draggable="false">
</picture>
</div>
</div>
<div class="d-flex flex-column justify-content-center">
<div class="i-rating-item d-flex gap-2 align-items-center flex-wrap mb-2">
<h3 class="base-heading mb-0 u-fw-700 u-h2 u-fw-800">
4.9
</h3>
<div class="i-rating__stars d-flex column-gap-1">
<span class="icon d-flex align-items-center justify-content-center --lg i-rating__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><g clip-path="url(#clip0_3547_90711)"><path fill="#FACA9D" d="m24 9.346-8.306-1.183L12 .827 8.306 8.163 0 9.346l6.012 5.744-1.414 8.083L12 19.358l7.402 3.815-1.414-8.083L24 9.346Z"/></g><defs><clipPath id="clip0_3547_90711"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></svg> </span>
<span class="icon d-flex align-items-center justify-content-center --lg i-rating__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><g clip-path="url(#clip0_3547_90711)"><path fill="#FACA9D" d="m24 9.346-8.306-1.183L12 .827 8.306 8.163 0 9.346l6.012 5.744-1.414 8.083L12 19.358l7.402 3.815-1.414-8.083L24 9.346Z"/></g><defs><clipPath id="clip0_3547_90711"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></svg> </span>
<span class="icon d-flex align-items-center justify-content-center --lg i-rating__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><g clip-path="url(#clip0_3547_90711)"><path fill="#FACA9D" d="m24 9.346-8.306-1.183L12 .827 8.306 8.163 0 9.346l6.012 5.744-1.414 8.083L12 19.358l7.402 3.815-1.414-8.083L24 9.346Z"/></g><defs><clipPath id="clip0_3547_90711"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></svg> </span>
<span class="icon d-flex align-items-center justify-content-center --lg i-rating__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><g clip-path="url(#clip0_3547_90711)"><path fill="#FACA9D" d="m24 9.346-8.306-1.183L12 .827 8.306 8.163 0 9.346l6.012 5.744-1.414 8.083L12 19.358l7.402 3.815-1.414-8.083L24 9.346Z"/></g><defs><clipPath id="clip0_3547_90711"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></svg> </span>
<span class="icon d-flex align-items-center justify-content-center --lg i-rating__icon">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><g clip-path="url(#clip0_3547_90711)"><path fill="#FACA9D" d="m24 9.346-8.306-1.183L12 .827 8.306 8.163 0 9.346l6.012 5.744-1.414 8.083L12 19.358l7.402 3.815-1.414-8.083L24 9.346Z"/></g><defs><clipPath id="clip0_3547_90711"><path fill="#fff" d="M0 0h24v24H0z"/></clipPath></defs></svg> </span>
</div>
</div>
<div class="d-flex gap-1 align-items-center flex-wrap">
<div class="i-company-reference__percentage px-1 u-bg-tertiary-400 text-nowrap u-fw-700 u-fz-sm">98%</div>
<div class="i-company-reference__text u-fw-500">
Spokojených zákazníků z 13 182 <a href="#">recenzí</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
