List block

A more complex Block for controlling the alignment of a List within it. Also supports a Tab group.

Example

Code sample

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<div class="block block_list">
  <h3 class="heading heading_section">
    RoboCat™
  </h3>
  <div class="description">
    <p>
      The quick brown fox jumps over the lazy dog.<br>
      Sphinx of black quartz, judge my vow. Pack my box with five dozen liquor jugs.
    </p>
  </div>
  <ul class="list_horizontal">
    <li>Sleek</li>
    <li>Fast</li>
    <li>Nimble</li>
    <li>Disloyal</li>
  </ul>
  <p class="call_to_action">
    <a href="#" class="button button_primary button_theme_primary">
      More information
    </a>
    <small class="call_to_action__fineprint">
      Batteries sold seperately
    </small>
  </p>
</div>

Usage notes

The .heading, .description, .call_to_action, and .call_to_action__fineprint elements are all considered optional.

Source files