Usage
Header
This is the box content.
<div class="c-box mb-0">
<h2 class="c-box__header">Header</h2>
<p class="c-box__content">This is the box content.</p>
<footer class="c-box__footer">Footer</footer>
</div>Implementation
| Type | Name | |
|---|---|---|
| Elements | ||
| Box | .c-box | |
| Header | .c-box__header | Optional |
| Content | .c-box__content | Optional |
| Footer | .c-box__footer | Optional |
| Modifiers | ||
| Color | .c-box--dark | |
| States | None |
Modifiers
Color
The dark version
Header
This is the box content.
<div class="c-box c-box--dark mb-0">
<h2 class="c-box__header">Header</h2>
<p class="px-5 py-4">This is the box content.</p>
</div>