<section class="m-footer-contact">
<h2 class="m-footer-contact__title">Kontakt</h2>
<div class="m-footer-contact__flex">
<div class="m-footer-contact__text">
<p><strong>Grüne Schweiz</strong><br><strong>Les Verts suisses</strong><br>Waisenhausplatz 21<br>3011 Bern</p>
<p>031 326 66 00<br>Postkonto 80-26747-3</p>
<p><a href='mailto:gruene@gruene.ch' class='a-button'>E-Mail senden</a></p>
</div>
<div class="m-footer-contact__social">
<a href="https://www.facebook.com/gruenelesverts/" class="a-social-icon" aria-label="">
<figure class="a-social-icon__figure">
<svg role="img" class="a-social-icon__svg">
<title>facebook</title>
<use xlink:href="#facebook"></use>
</svg>
</figure>
</a>
<a href="https://twitter.com/GrueneCH" class="a-social-icon" aria-label="">
<figure class="a-social-icon__figure">
<svg role="img" class="a-social-icon__svg">
<title>twitter</title>
<use xlink:href="#twitter"></use>
</svg>
</figure>
</a>
<a href="https://www.instagram.com/gruenelesverts/" class="a-social-icon" aria-label="">
<figure class="a-social-icon__figure">
<svg role="img" class="a-social-icon__svg">
<title>instagram</title>
<use xlink:href="#instagram"></use>
</svg>
</figure>
</a>
</div>
</div>
</section>
<section class="m-footer-contact">
<h2 class="m-footer-contact__title">{{title}}</h2>
<div class="m-footer-contact__flex">
<div class="m-footer-contact__text">{{{address}}}</div>
<div class="m-footer-contact__social">
{{> @a-social-icon facebook}}
{{> @a-social-icon twitter}}
{{> @a-social-icon instagram}}
</div>
</div>
</section>
.m-footer-contact {
&__title {
margin-top: 0;
margin-bottom: 40px;
@include fluid-props(font-size, $size-tiny, $size-medium, 20px, 32px);
}
&__text p {
font-size: 0.875rem;
}
&__text > p:first-of-type {
margin-top: 0;
}
&__flex {
display: flex;
justify-content: space-between;
}
&__social {
width: 32px;
a {
height: 32px;
margin-bottom: 16px;
}
}
&__text {
max-width: calc(100% - 48px);
}
}
{
"title": "Kontakt",
"address": "<p><strong>Grüne Schweiz</strong><br><strong>Les Verts suisses</strong><br>Waisenhausplatz 21<br>3011 Bern</p><p>031 326 66 00<br>Postkonto 80-26747-3</p><p><a href='mailto:gruene@gruene.ch' class='a-button'>E-Mail senden</a></p>",
"button": {
"label": "E-Mail senden",
"link": "mailto:gruene@gruene.ch"
},
"facebook": {
"type": "facebook",
"link": "https://www.facebook.com/gruenelesverts/"
},
"twitter": {
"type": "twitter",
"link": "https://twitter.com/GrueneCH"
},
"instagram": {
"type": "instagram",
"link": "https://www.instagram.com/gruenelesverts/"
}
}
No notes defined.