Lists

The info list is an extremely versatile module that can be used for a variety of text organization purposes. Its best used when list items need different images/icons, a specific layout for desktop versus mobile screens, and a link or description attached to each list item.

The icon number list is a simple module to help list out bullet items in a more interactive and appealing way. A singular icon can be used as the “bullet” for an unordered list OR a number sequence can be applied to an ordered list. If a different icon or image needs to be applied to each list item, use the info list module instead.

Site Goal(s): Provide Information | Use Case(s): Callouts, Features, Page Content

Lists

Info List: Call-Outs Info List: Features Icon Lists Number Lists

Info List: Call-Outs

Icon Type: Icon
Icon Position: Top
Link: Complete box
List Connector: Dotted
Mobile Icon Position: Stack

Info List: Features

Icon Type: Icon
Icon Position: Right & Left
Link: No Link
List Connector: Solid
Mobile Icon Position: Stack

Lorem ipsum
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Dolor sit
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Consectetur
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Adipiscing elit
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Icon Lists

Lorem ipsum dolor sit amet
Laoreet id donec ultrices tincidunt arcu
Ultrices vitae auctor eu augue ut lectus
Convallis posuere morbi leo urna
Nullam ac tortor vitae purus faucibus

Lorem ipsum dolor sit amet
Laoreet id donec ultrices tincidunt arcu
Ultrices vitae auctor eu augue ut lectus
Convallis posuere morbi leo urna
Nullam ac tortor vitae purus faucibus

Lorem ipsum dolor sit amet
Laoreet id donec ultrices tincidunt arcu
Ultrices vitae auctor eu augue ut lectus
Convallis posuere morbi leo urna
Nullam ac tortor vitae purus faucibus

Number Lists

1 Lorem ipsum dolor sit amet
2 Laoreet id donec ultrices tincidunt arcu
3 Ultrices vitae auctor eu augue ut lectus
4 Convallis posuere morbi leo urna
5 Nullam ac tortor vitae purus faucibus

1 Lorem ipsum dolor sit amet
2 Laoreet id donec ultrices tincidunt arcu
3 Ultrices vitae auctor eu augue ut lectus
4 Convallis posuere morbi leo urna
5 Nullam ac tortor vitae purus faucibus

1 Lorem ipsum dolor sit amet
2 Laoreet id donec ultrices tincidunt arcu
3 Ultrices vitae auctor eu augue ut lectus
4 Convallis posuere morbi leo urna
5 Nullam ac tortor vitae purus faucibus