...
List items must have a label, with the main object name. If the entire name does not fit, it can be truncated and a Tooltip can be used on hover.
List items can optionally also have:
A leading icon. These should only be used if the list can contain several types of objects. If all items are of the same type, an icon should not be used.
A leading image.
Up to 2 secondary lines of text. Secondary lines cannot have their own leading icons or images.
Extra metadata, such as a tag, text, or an icon. These should be positioned to the right of the item, centered vertically.
Up to 2 action icons, such as delete. These should only appear on hover or when an item is selected. They should be positioned to the right of the item, centered vertically (replacing the extra metadata, if exists).
For lists which support multi-select, the number of selected items will be displayed in brackets to the right of the total number of items. If no item is selected it should display “(0 selected)”.
Single-line list | Two-line list | Three-line list | |
---|---|---|---|
Full list | |||
Single Item | |||
Single item with icon / image | |||
Single item with multi select |
...