No notes defined.
<div class="ds2-placeholder" style="height: {{ height }}px ">
<p class="ds2-placeholder__text">{{ content | safe }}</p>
</div>
<div class="ds2-placeholder" style="height: 300px ">
<p class="ds2-placeholder__text">Wireframe component with configurable height (300px)</p>
</div>
.ds2-placeholder {
font-family: uolInter, Arial, Helvetica, sans-serif;
width: calc(100% - 2px);
display: flex;
align-items: center;
justify-content: center;
border: 1px solid $color-brand-black-20;
border-top: none;
background-image: repeating-linear-gradient(-45deg,
$color-brand-black-20 20px,
$color-brand-black-20 22px,
transparent 22px,
transparent 40px);
&__text {
background: $color-white;
padding: 10px;
font-size: $spacing-4;
}
}
{
"content": "Wireframe component with configurable height (300px)",
"height": "300"
}