Lunds universitet - Style Guide

Nav Pills 

<ul class="nav nav-pills">
    <li class="nav-item">
        <a class="nav-link active" aria-current="page" href="#">Active</a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
    </li>
    <li class="nav-item">
        <a class="nav-link" href="#">Link</a>
    </li>
    <li class="nav-item">
        <a class="nav-link disabled" href="#">Disabled</a>
    </li>
</ul>
 
<ul class="nav nav-pills{{modifiers modifiers}}">
  {{#each items}}
    <li class="nav-item">
      <a class="nav-link{{modifiers modifiers}}" {{#if active}}aria-current="page" {{/if}} href="{{link}}">{{#if icon}}<span class="me-1">{{render "@icon--remove"}}</span> {{/if}}{{label}}</a>
    </li>
  {{/each}}
</ul>
 
{
  "items": [
    {
      "label": "Active",
      "link": "#",
      "modifiers": [
        "active"
      ],
      "active": true
    },
    {
      "label": "Link",
      "link": "#"
    },
    {
      "label": "Link",
      "link": "#"
    },
    {
      "label": "Disabled",
      "link": "#",
      "modifiers": [
        "disabled"
      ]
    }
  ]
}

No notes defined.