Lists

Lists can be used at many places like navigation bar, stacked notifications, article pages, etc.

Examples

  1. ObjOne
  2. ObjTwo
  3. ObjThree
  4. ObjFour
  5. ObjFive
  1. ObjOne
  2. ObjTwo
  3. ObjThree
  4. ObjFour
  5. ObjFive
  1. ObjOne
  2. ObjTwo
  3. ObjThree
  4. ObjFour
  5. ObjFive
  1. ObjOne
  2. ObjTwo
  3. ObjThree
  4. ObjFour
  5. ObjFive
  • ObjOne
  • ObjTwo
  • ObjThree
  • ObjFour
  • ObjFive
  • ObjOne
  • ObjTwo
  • ObjThree
  • ObjFour
  • ObjFive
                   
<ol class="ol-upper-alpha">
    <li>ObjOne</li>
    <li>ObjTwo</li>
    <li>ObjThree</li>
    <li>ObjFour</li>
    <li>ObjFive</li>
  </ol>

  <ol class="ol-lower-alpha">
    <li>ObjOne</li>
    <li>ObjTwo</li>
    <li>ObjThree</li>
    <li>ObjFour</li>
    <li>ObjFive</li>
  </ol>

  <ol class="ol-upper-roman">
    <li>ObjOne</li>
    <li>ObjTwo</li>
    <li>ObjThree</li>
    <li>ObjFour</li>
    <li>ObjFive</li>
  </ol>

  <ol class="ol-lower-roman">
    <li>ObjOne</li>
    <li>ObjTwo</li>
    <li>ObjThree</li>
    <li>ObjFour</li>
    <li>ObjFive</li>
  </ol>

  <!-- unordered list -->
  <ul class="ul-circle">
    <li>ObjOne</li>
    <li>ObjTwo</li>
    <li>ObjThree</li>
    <li>ObjFour</li>
    <li>ObjFive</li>
  </ul>

  <ul class="list-none flex flex-col w-max">
    <li class="m-1 bg-grey-400 p-2">ObjOne</li>
    <li class="m-1 bg-grey-400 p-2">ObjTwo</li>
    <li class="m-1 bg-grey-400 p-2">ObjThree</li>
    <li class="m-1 bg-grey-400 p-2">ObjFour</li>
    <li class="m-1 bg-grey-400 p-2">ObjFive</li>
  </ul>
</div>