<div class="c-response-msg c-response-msg--raw o-response-msg">
<p class="c-response-msg__title">Il tuo viaggio inizia da qui...</p>
<div class="o-response-msg__further-text">
<a href="#" class="c-link c-link--primary">
<span>Scopri il nuovo sito</span>
<svg class="svg-24">
<use xlink:href="#ic_chevron_right_black_24px"></use>
</svg></a>
</div>
</div>
<div class="c-response-msg c-response-msg--raw o-response-msg">
<p class="c-response-msg__title">{{ message }}</p>
<div class="o-response-msg__further-text">
{{> @link--primary link }}
</div>
</div>
{
"img-path": "/images/svgs/flight.svg",
"img-alt": "Carrello vuoto",
"message": "Il tuo viaggio inizia da qui...",
"further-text": "<a href=\"#\">Torna alle tue prenotazioni</a>",
"link": {
"text": "Scopri il nuovo sito",
"url": "#",
"modifier": "c-link--primary",
"svg": true
}
}
.c-response-msg {
background-color: #fff;
border-radius: remify(4px);
main & {
grid-column: main;
z-index: $zIndex-responseMessage;
}
.c-main--flight-payed &,
.c-main-reservationDetail & {
background-color: transparent;
}
.c-response-msg__title {
font-weight: fw(light);
@include font-scale(level-5);
}
}
/*------------------------------------*\
Object CSS
\*------------------------------------*/
.o-response-msg {
padding: remify(64px) remify(16px);
.c-main--flight-payed & {
padding: remify(24px);
}
> * {
text-align: center
}
img {
margin: 0 auto remify(32px);
display: block;
width: remify(80px);
}
h2,
.c-response-msg__title {
margin-bottom: remify(16px);
@include font-scale(level-5);
}
}
/*------------------------------------*\
Raw modifier
\*------------------------------------*/
.c-response-msg--raw {
main & {
grid-column: full;
}
}
/*------------------------------------*\
Manteinance modifier
\*------------------------------------*/
.c-response-msg--manteinance {
main & {
grid-column: full;
}
background-color: primary(sky, 10);
color: primary(night, 100);
}
No notes defined.