List

Format list elements.
.list-unstyle .list-inline .list-center

Loop config includes list classes by default. In manual mode use the mixin List()

# Unstyle

Remove default style of list elements

<ul class="list-unstyle">
  <li>Lorem ipsum dolor sit amet consectetur.</li>
  <li>Lorem ipsum dolor sit amet consectetur.</li>
  <li>Lorem ipsum dolor sit amet consectetur.</li>
</ul>

# Inline

Set horizontal list. Adjust the the gap between from the property inlineSpacing of list.

// default config
list: (
  ...
  inlineSpacing: 1em,
),

<ul class="list-inline">
  <li>item 1</li>
  <li>item 2</li>
  <li>item 3</li>
  <li>item 4</li>
</ul>

# Center

Horizontally center list elements.

<ul class="list-center">
  <li>Lorem ipsum dolor sit.</li>
  <li>Lorem ipsum dolor sit amet consectetur.</li>
  <li>Lorem ipsum dolor sit amet.</li>
</ul>
<ul class="list-unstyle list-center">
  <li>Lorem ipsum dolor sit amet consectetur.</li>
  <li>Lorem ipsum dolor sit amet.</li>
  <li>Lorem ipsum dolor sit consectetur.</li>
</ul>
<ul class="list-inline list-center">
  <li>item 1</li>
  <li>item 2</li>
  <li>item 3</li>
  <li>item 4</li>
</ul>

Use Visibility classes << >> Use Miscellaneous classes