# List

# Basics

The List block is a quick way to create lists of text that sit on top of each other.

You can add a new line to the list by pressing the Enter key.

If you want to add a list outside any other block on the page:

  1. Click on the  ​​icon to open the Inserter Panel
  2. Search for the Cwicly List block
  3. Click on the Cwicly List block to insert it into your page

If you want to add a list inside a parent block:

  1. Open the Quick Insert panel in the parent block
  2. Search for the Cwicly List block
  3. Click on the Cwicly List block to insert it into your parent block

# Icons

When activated, the Icon property allows you to choose whether you want the list bullet to be an icon.

  1. Select a List block
  2. Open the block inspector
  3. Navigate to the primary tab
  4. Open the Icons tab​​
  5. Find the Icon property
  6. Toggle the Icon property

# Select Icon

Use the Icon Selector to select the desired icon.

  1. Select a List block
  2. Open the block inspector
  3. Navigate to the primary tab
  4. Open the Icon panel
  5. Find the Icon property
  6. Click on the 🌏 icon to open the Icon Selector

# Specific Icons

The List block allows you to choose specific icons for every list element.

  1. Select a List block
  2. Open the block inspector
  3. Navigate to the primary tab
  4. Open the Icon panel
  5. Click on the Specific Icons  icon
  6. Find the List element you want to define an icon for
  7. Toggle the List Icon x property (x being the position of the element in the list)
  8. Select an icon using the Icon Selector

# Spacing

The Spacing property allows you to define the margin added between the icon and the text.

  1. Select a List block
  2. Open the block inspector
  3. Navigate to the primary tab
  4. Open the Icon panel
  5. Find the Spacing property
  6. Enter the desired value

# Icon Size

The Icon Size property defines the size of the icon.

  1. Select a List block
  2. Open the block inspector
  3. Navigate to the primary tab
  4. Open the Icon panel
  5. Find the Icon Size property
  6. Enter the desired value

# Vertical Position

The Vertical Position property allows you to define the vertical position relative to the text element in the list.

  1. Select a List block
  2. Open the block inspector
  3. Navigate to the primary tab
  4. Open the Icon panel
  5. Find the Vertical Position property
  6. Enter the desired value

# Icon Color

The Icon Color property allows you to define the icon color.

  1. Select a List block
  2. Open the block inspector
  3. Navigate to the primary tab
  4. Open the Icon panel
  5. Open the color picker by clicking on the color circle
  6. Select your color in the color picker or click on a global color

# List

# Inline List

The Inline List property allows you to define whether you want to make your list horizontal instead of vertical.

  1. Select a List block
  2. Open the block inspector
  3. Navigate to the primary tab
  4. Open the List panel
  5. Find the Inline List property
  6. Toggle the Inline List property

# Spacing

The Spacing property allows you to define the margin added between every list element.

  1. Select a List block
  2. Open the block inspector
  3. Navigate to the primary tab
  4. Open the List panel
  5. Find the Spacing property
  6. Enter the desired value

# Indent

The Indent property allows you to define the margin added to the left of the list element to indent it.

  1. Select a List block
  2. Open the block inspector
  3. Navigate to the primary tab
  4. Open the List panel
  5. Find the Indent property
  6. Enter the desired value