<div class="message-box">
<div class="message-box__content"><b>Gleich geschafft!</b> Nur noch 1 Schritt bis zum Abschluss.
</div>
<div class="message-box__icon">
<svg class="icon icon--thumbs-up" id="icon-8ee1" viewBox="0 0 200 200" role="presentation">
<use xlink:href="#icon-thumbs-up"></use>
</svg>
</div>
</div>
-
//- Prepare attr object
attr = attr || {};
attr.class = classList(attr.class);
//- Render box
.message-box&attributes(attr)
//- Box content
if content
.message-box__content
!= renderPug(content)
//- Icon
if icon
.message-box__icon
!= include('@icon', {icon})
{
"icon": "thumbs-up",
"content": "| #[b Gleich geschafft!] Nur noch 1 Schritt bis zum Abschluss.\n"
}
.message-box {
align-items: center;
background-color: $color-sand;
border-radius: 0.4rem;
display: flex;
justify-content: space-between;
padding: 1.5rem;
@include mq($from: m) {
padding: 1.5rem 2.5rem;
}
}
.message-box__icon {
font-size: 2.4rem;
opacity: 0.25;
}
.message-box__content {
font-size: 1.5rem;
}
There are no notes for this item.