Meta list

Meta list is a short horizontal list of meta/secondary information.

Usage
Code

Meta list is a short horizontal list that helps in displaying secondary or meta-information separated by dots.

Variants

Default

The default variant includes just text.

Default meta list

With icon

This variant comes with an icon in the left preceding the text to provide additional cues regarding the meta/secondary information.

Meta list with icon in the left

Sizes

Meta list comes in two sizes - small and regular.

Structure



Structure of metalist
PropertyValue(s)
Padding
(top, right, bottom, left)
12 px, 24 px, 12 px, 16 px

Configurations

PropertyValue(s)Default value
Size
  • Small
  • Regular
  • Regular
    Label<label>-
    Icon left
    (optional)
    <icon name>-
    Separator
  • True
  • False
  • True

    Usage

    In the page header

    Page headers use meta list to provide secondary/meta information just below the title.

    Meta list in the page header Meta list in the page header

    In a table cell

    There is a cell variant in the table which uses meta list to show secondary/meta information.

    Meta list in a table Meta list in a table