<ol class="link-list link-list--horizontal">
    <li class="link-list__item">
        <a href="#" title="Link title 1" target="" class="link" property="url">Link text 1</a>
    </li>
    <li class="link-list__item">
        <a href="#" title="Link title 2" target="" class="link" property="url">Link text 2</a>
    </li>
    <li class="link-list__item">
        <a href="#" title="Link title 3" target="" class="link" property="url">Link text 3</a>
    </li>
</ol>
{{> @link-list modifier="link-list--horizontal"}}
{
  "list": [
    {
      "url": "#",
      "text": "Link text 1",
      "title": "Link title 1"
    },
    {
      "url": "#",
      "text": "Link text 2",
      "title": "Link title 2"
    },
    {
      "url": "#",
      "text": "Link text 3",
      "title": "Link title 3"
    }
  ]
}
  • Content:
    .link-list {
        margin: 0;
        padding: 0;
    
        &__item + &__item {
            margin-top: 5px;
        }
    
        &--horizontal {
            .link-list__item {
                display: inline-block;
            }
        }
    }
    
  • URL: /components/raw/link-list/link-list.css
  • Filesystem Path: patterns/02-molecules/link-list/link-list.css
  • Size: 201 Bytes