<!-- Default -->
<div class="l-section">
<div class="placeholder">
Regular section
</div>
</div>
<!-- Large -->
<div class="l-sectionLarge">
<div class="placeholder">
Large section
</div>
</div>
<!-- Small -->
<div class="l-sectionSmall">
<div class="placeholder">
Small section
</div>
</div>
<div class="{{ class }}">
<div class="placeholder">
{{ description }}
</div>
</div>
/* Default */
{
"placeholder": "Placeholder element",
"class": "l-section",
"description": "Regular section"
}
/* Large */
{
"placeholder": "Placeholder element",
"class": "l-sectionLarge",
"description": "Large section"
}
/* Small */
{
"placeholder": "Placeholder element",
"class": "l-sectionSmall",
"description": "Small section"
}
Sections are used to separate content vertically. Typycally a .l-container
is used within them.