<div class="c-contact-strip ">
<div class="c-contact-strip__el">
<img src="/images/cotabo-logo.jpg" alt="Cotabo">
</div>
<div class="c-contact-strip__el">
<p>Società: <strong>Cotabo</strong><br>Telefono: <strong>051 1234567</strong></p>
</div>
<div class="c-contact-strip__el">
<a href="#">Visita il sito <span aria-hidden="true">→</span></a>
</div>
</div>
<div class="c-contact-strip {{ modifier }}">
{{#each elements}}
<div class="c-contact-strip__el">
{{{ this.raw-content }}}
</div>
{{/each}}
</div>
{
"logo": {
"path": "/images/flight-companies/aegean-scheda-compagnia.png",
"alt": "Aegean"
},
"small-text": "Codice: A3",
"strong-text": "Aegean Airlines",
"body-contact-info": "<p>Call center: 069 7150532-33 <a href=\"#\">www.aegeanair.com</a></p>",
"link": {
"url": "#",
"text": "Scopri le destinazioni <span aria-hidden=\"true\">→</span>"
},
"elements": [
{
"raw-content": "<img src=\"/images/cotabo-logo.jpg\" alt=\"Cotabo\">"
},
{
"raw-content": "<p>Società: <strong>Cotabo</strong><br>Telefono: <strong>051 1234567</strong></p>"
},
{
"raw-content": "<a href=\"#\">Visita il sito <span aria-hidden=\"true\">→</span></a>"
}
]
}
.c-contact-strip {
padding: remify(16px);
background-color: secondary(soft, 100);
border: 1px solid primary(night, 20);
border-radius: remify(16px);
@include shadow(medium);
text-align: center;
@include min-screen(bp(tablet)) {
text-align: left;
}
.c-contact-strip__wrapper {
@include min-screen(bp(tablet)) {
display: flex;
flex: 1;
justify-content: space-between;
}
}
main & {
grid-column: main;
}
.c-canvas & {
margin-bottom: remify(16px);
}
.c-rounded-label {
margin: 0 auto remify(8px);
line-height: 1;
@include min-screen(bp(tablet)) {
margin-bottom: remify(4px);
}
.icon {
font-size: remify(24px);
transform: rotate(-90deg);
vertical-align: middle;
margin-right: remify(4px);
}
strong {
@include font-scale(level-1, bold);
}
}
.c-contact-strip__el {
display: flex;
align-items: center;
flex-direction: column;
margin-bottom: remify(16px);
@include min-screen(bp(tablet)) {
margin-bottom: 0;
flex: 1;
flex-direction: row;
justify-content: flex-start;
padding: 0 remify(8px);
&.is-last {
justify-content: flex-end;
}
}
&:last-child {
margin-bottom: 0;
}
a {
color: primary(night, 120);
}
}
figure {
margin-right: remify(16px);
}
figcaption {
font-size: 75%;
text-align: center;
margin-top: remify(4px);
}
}
.c-contact-strip + .c-contact-strip {
margin-top: remify(16px);
}
No notes defined.