Card displaying link of download resource links including their file types.

Example

---

Macro

{{ downloadsCard({
  title: "Alternative versions",
  items: [
    {
      title: "First Publication Title",
      text: "First Publication Title",
      url: "#",
      docSize: "836KB",
      docType: "PDF",
      tagColor: "pdf"
    },
    {
      title: "Second Publication Title",
      text: "Second Publication Title",
      url: "#",
      docSize: "1.4MB",
      docType: "ODF",
      tagColor: "odf"
    },
    {
      title: "Third Publication Title",
      text: "Third Publication Title",
      url: "#",
      docSize: "2.89MB",
      docType: "XLS",
      tagColor: "xls"
    }
  ]
}) }}
  

---

HTML

<div class="hee-card hee-card--details hee-card--downloads">
    <h3>Alternative versions</h3>
    <div class="hee-card--details__item">
      <a class="hee-resources__link" href="#" title="First Publication Title">
        <div class="hee-resources__wrapper">
          <span class="hee-resources__text">Short title</span><span class="hee-resources__docSize"> 836KB </span>
        </div><span class="hee-resources__tag
          hee-resources__pdf"> PDF </span>
      </a>
    </div>
    <div class="hee-card--details__item">
      <a class="hee-resources__link" href="#" title="Second Publication Title">
        <div class="hee-resources__wrapper">
          <span class="hee-resources__text"> Second Publication Title </span><span class="hee-resources__docSize"> 1.4MB </span>
        </div><span class="hee-resources__tag
          hee-resources__odf"> ODF </span>
      </a>
    </div>
    <div class="hee-card--details__item">
      <a class="hee-resources__link" href="#" title="Third Publication Title">
        <div class="hee-resources__wrapper">
          <span class="hee-resources__text"> Third Publication Title </span><span class="hee-resources__docSize"> 2.89MB </span>
        </div><span class="hee-resources__tag
          hee-resources__xls"> XLS </span>
      </a>
    </div>
</div>