# [VCL](https://vcl.github.io/vcl/) list

List without interaction.

## Features

- Layout of nested lists.
- Group header.
- Separator.
- Custom bullet icon for items.
- Vertical and horizontal alignment.

## Usage

Unordered.

[unordered example](/demo/example-unordered.html)

Ordered list.

[ordered example](/demo/example-ordered.html)

A list of definitions such as for terms in a glossary.

[definition-list example](/demo/example-definition.html)

A list made with custom icons instead of standard bullets.
The icogram component is used to create the icon/ label pairs.

[icons example](/demo/example-icons.html)

The `list-horizontal` modifier makes the list items align horizontally.

[horizontal example](/demo/example-horizontal.html)

Generally, list items can also be anchor tags to form a list of links.

## Classes

- `list`
- `list-item`
- `list-separator`
- `list-group-header`

## Modifiers

- `list-horizontal`: to align the list items horizontally.
- `list-custom-bullets`: if custom icons for bullets shall be used.

## Variables

- `$list-separator-border-color`