Widgets
Markup for creating a new widget

Block

1
<section class="block">
2
Standard widget markup
3
</section>
Copied!

Background Color

1
<section class="block white-bg">White background</section>
2
<section class="block gray-bg">Light background</section>
3
<section class="block dark-bg">Dark background</section>
4
<section class="block theme-bg">Theme background</section>
5
<section class="block theme-alt-bg">Theme alt background</section>
Copied!

Text Color

1
<section class="block">Dark Text</section>
2
<section class="block light-color">Light Text</section>
Copied!

Compact

1
<section class="block block--compact">Less padding</section>
Copied!

Block header

1
<section class="block">
2
3
<div class="block__header">
4
<h6 class="pre-head">Sub header</h6>
5
<h2>Heading</h2>
6
<div class="block__header-text">
7
<p>Text</p>
8
</div>
9
</div>
10
11
<div class="block__body">
12
Block body
13
</div>
14
15
</section>
Copied!
Last modified 1yr ago