Lehigh Clutch Style Guide

Ordered List 

<ol class="ol">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
</ol>
 
<ol class="ol">
    {% for ol_item in ol_items %}
        <li>{{ ol_item.content }}</li>
    {% endfor %}
</ol>
 
{
  "ul_items": {
    "1": {
      "content": "Item 1"
    },
    "2": {
      "content": "Item 2"
    },
    "3": {
      "content": "Item 3"
    },
    "4": {
      "content": "Item 4"
    }
  },
  "ol_items": {
    "1": {
      "content": "Item 1"
    },
    "2": {
      "content": "Item 2"
    },
    "3": {
      "content": "Item 3"
    },
    "4": {
      "content": "Item 4"
    }
  }
}
  • Content: 
    .ol {
  &.u_alpha {
    list-style-type: upper-alpha;
  }

  &.l_alpha {
    list-style-type: lower-alpha;
  }

  &.u_roman {
    list-style-type: upper-roman;
  }

  &.l_roman {
    list-style-type: lower-roman;
  }
}
  • URL: /components/raw/lists/lists.scss
  • Filesystem Path: bits/02-general/text/lists/lists.scss
  • Size: 219 Bytes

Show ordered list.