<div class="c-file">
<div class="c-file__media">
<a href="#" class="c-file__cta" target="_blank">
<img class="c-file__img" src="https://picsum.photos/320/450" srcset="https://picsum.photos/320/450" sizes="100vw" loading="lazy" alt="" />
<span class="c-file__cta-text">Scarica il PDF del nostro Codice Etico</span>
</a>
</div>
<div class="c-file__content">
<div class="c-file__content-label">
<p>Il nostro Codice Etico</p>
</div>
<div class="c-file__content-title">
<p>Operiamo secondo principi, valori e responsabilità chiari e condivisi.</p>
</div>
<div class="c-file__content-body o-paragraph">
<p>Integrità, legalità, equità, multiculturalità, mutualismo, sostenibilità, dialogo e miglioramento continuo sono al centro della nostra organizzazione e al centro dei progetti sui quali lavoriamo per i nostri clienti.</p>
<p>Consideriamo un pilastro fondamentale del nostro operato, della nostra reputazione e delle relazioni con i nostri stakeholder.</p>
</div>
</div>
</div>
<div class="c-file{% if modifier is defined %} {{ modifier }}{% endif %}">
<div class="c-file__media">
<a href="{{ cta.url }}" class="c-file__cta" target="_blank">
<img class="c-file__img"
src="{{ image.src|default("") }}"
srcset="{{ image.srcset|default("") }}"
sizes="100vw"
loading="lazy"
alt="{{ image.alt|default("") }}" />
<span class="c-file__cta-text">{{ cta.text }}</span>
</a>
</div>
<div class="c-file__content">
<div class="c-file__content-label">{{ label|raw }}</div>
<div class="c-file__content-title">{{ title|raw }}</div>
<div class="c-file__content-body o-paragraph">{{ body|raw }}</div>
</div>
</div>
{
"image": {
"src": "https://picsum.photos/320/450",
"srcset": "https://picsum.photos/320/450",
"alt": ""
},
"cta": {
"url": "#",
"text": "Scarica il PDF del nostro Codice Etico"
},
"label": "<p>Il nostro Codice Etico</p>",
"title": "<p>Operiamo secondo principi, valori e responsabilità chiari e condivisi.</p>",
"body": "<p>Integrità, legalità, equità, multiculturalità, mutualismo, sostenibilità, dialogo e miglioramento continuo sono al centro della nostra organizzazione e al centro dei progetti sui quali lavoriamo per i nostri clienti.</p><p>Consideriamo un pilastro fondamentale del nostro operato, della nostra reputazione e delle relazioni con i nostri stakeholder.</p>"
}
.c-file {
@include min-screen(bp(medium)) {
display: flex;
}
@include min-screen(bp(xlarge)) {
align-items: center;
}
}
.c-file__media {
margin-bottom: spacing(space-24);
text-align: center;
@include min-screen(bp(medium)) {
flex: 1 0 remify(320px);
margin-right: spacing(space-96);
margin-bottom: 0;
}
}
.c-file__img {
width: remify(320px);
}
.c-file__cta {
color: useHSL(--primary-100);
&[target=_blank]:after {
display: none;
}
}
.c-file__cta-text {
display: block;
@include font-scale(level-2, $font-secondary, bold);
margin-top: spacing(space-24);
}
.c-file__content-label {
@include font-scale(level-3, $font-secondary, bold);
color: useHSL(--primary-100);
}
.c-file__content-title {
@include font-scale(level-7, $font-primary, extrabold);
color: useHSL(--primary-100);
margin-bottom: spacing(space-24);
}
No notes defined.