<div class="block-cta">
<h2>Besoin d'une offre sur mesure ?</h2>
<a href="#" class="button button--white button--rounded">Demander un devis</a>
</div>
<div class="block-cta{{#if block_cta.theme}} block-cta--{{block_cta.theme}}{{/if}}">
<h2>{{block_cta.title}}</h2>
<a href="{{block_cta.button.link}}" class="button button--white button--rounded">{{block_cta.button.title}}</a>
</div>
{
"block_cta": {
"title": "Besoin d'une offre sur mesure ?",
"button": {
"link": "#",
"title": "Demander un devis"
}
}
}
.block-cta {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
background: $c-black;
border-radius: $border-radius-l $border-radius-l 0 $border-radius-l;
padding: $margin-l;
margin-top: $margin-l;
@include mediaWQuery($media-query-m) {
flex-direction: row;
margin-top: $margin-xl*1.5;
}
h2 {
color: $c-white;
margin-top: 0;
@include mediaWQuery($media-query-m) {
margin: 0 $margin-l 0 0;
padding: 0;
}
}
.button {
margin-top: 0;
border-radius: 0;
border: 0;
background: linear-gradient(180deg, #E3CB78 0%, #BDA450 100%);
width: 100%;
font-family: $font-secondary;
@include mediaWQuery($media-query-m) {
width: auto;
flex-shrink: 0;
}
&.button--white:hover,
&.button--white:active,
&.button--white:focus{
box-shadow: 0 0 1rem rgba(255,255,255,.3);
}
}
}
There are no notes for this item.