Skip to content

Featured List

A list with line separators.

It's a list with lines.

Functional Requirements

  1. The Featured List contains a title.
  2. Includes a list of items in a single, stacked column.
  3. List items are separated or set off by an optional separating element.
  4. The list can be left, center or right justified
  5. List can contain numbered or un-numbered items.

Specifications

Properties

PropertyTypeDescriptionRequiredDefault

Changelog

1.0.0

  • featured-list added

Examples

Default

<ul class="tux-c-featured-list">
	<li>Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</li>
	<li>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam quis risus eget urna mollis ornare vel eu leo. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.</li>
	<li>Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec id elit non mi porta gravida at eget metus.</li>
	<li>Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</li>
	<li>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam quis risus eget urna mollis ornare vel eu leo. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.</li>
	<li>Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec id elit non mi porta gravida at eget metus.</li>
	<li>Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</li>
</ul>

Ordered List

<ol class="tux-c-featured-list">
	<li>Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</li>
	<li>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam quis risus eget urna mollis ornare vel eu leo. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.</li>
	<li>Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec id elit non mi porta gravida at eget metus.</li>
	<li>Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</li>
	<li>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam quis risus eget urna mollis ornare vel eu leo. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.</li>
	<li>Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec id elit non mi porta gravida at eget metus.</li>
	<li>Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</li>
</ol>