Vebego Component Library

Download link list 

<div class="mol-download-link-list">
      <ul>
          <li>
              <a class="atm-link " href="#" title="This is what a link looks like" aria-label="" target="">Jaarverslag 2018</a>
          </li>
          <li>
              <a class="atm-link " href="#" title="This is what a link looks like" aria-label="" target="">Jaarverslag 2019</a>
          </li>
          <li>
              <a class="atm-link " href="#" title="This is what a link looks like" aria-label="" target="">Jaarverslag 2020</a>
          </li>
          <li>
              <a class="atm-link " href="#" title="This is what a link looks like" aria-label="" target="">Jaarverslag 2021</a>
          </li>
          <li>
              <a class="atm-link " href="#" title="This is what a link looks like" aria-label="" target="">Jaarverslag 2022</a>
          </li>
      </ul>
  </div>
 
{{#if active}}
  <div class="mol-download-link-list">
    <ul>
      {{#each items}}
        <li>
          {{render "@link" this merge=true}}
        </li>
      {{/each}}
    </ul>
  </div>
{{/if}}
 
{
  "active": true,
  "items": [
    {
      "text": "Jaarverslag 2018"
    },
    {
      "text": "Jaarverslag 2019"
    },
    {
      "text": "Jaarverslag 2020"
    },
    {
      "text": "Jaarverslag 2021"
    },
    {
      "text": "Jaarverslag 2022"
    }
  ]
}
  • Content: 
    .mol-download-link-list {
    .atm-link {
        @apply text-black no-underline hover:text-cta hover:underline leading-7 break-words;
    }
}
  • URL: /components/raw/download-link-list/download-link-list.css
  • Filesystem Path: src\components\03-molecules\download-link-list\download-link-list.css
  • Size: 148 Bytes
  • Handle: @download-link-list
  • Preview:
  • Filesystem Path: src\components\03-molecules\download-link-list\download-link-list.hbs
  • References (1): @link

No notes defined.