{namespace v=FluidTYPO3\Vhs\ViewHelpers}

<div id="download-{item.download_slug}" class="card js-frame var-color-{item.opt_color}">
  <f:if condition="{item.download_title} or {item.download_info}">
  <div class="card-info">
    <f:if condition="{item.download_title}">
    <h4>{item.download_title}</h4>
    </f:if>
    <f:if condition="{item.download_info}">
    <p class="text"> <f:format.nl2br>{item.download_info}</f:format.nl2br> </p>
    </f:if>
  </div>
  </f:if>

  <f:if condition="{item.download_links}">
  <div class="card-links">
    <f:for each="{item.download_links}" as="link">

    <f:if condition="{v:format.substring(content: link.link.url, start: 0, length: 9)} == 't3://file'">
      <f:then>
        <f:variable name="resolvedUrl">{f:uri.typolink(parameter: link.link)}</f:variable>
        <f:variable name="fileName">{resolvedUrl -> v:iterator.explode(glue: '/') -> v:iterator.last()}</f:variable>

        <f:if condition="{v:format.substring(content: resolvedUrl, start: '-4')} == '.pdf'">
          <f:then>
            <f:variable name="linkClass">btn-link-pdf</f:variable>
            <f:variable name="defaultLabel"><f:translate key="download.pdf" extensionName="zab_site" /> - {fileName}</f:variable>
          </f:then>
          <f:else>
            <f:variable name="linkClass">btn-link-file</f:variable>
            <f:variable name="defaultLabel"><f:translate key="download.file" extensionName="zab_site" /></f:variable>
          </f:else>
        </f:if>
      </f:then>
      <f:else>
        <f:variable name="linkClass">btn-link-url</f:variable>
        <f:variable name="defaultLabel"><f:translate key="download.link" extensionName="zab_site" /></f:variable>
      </f:else>
    </f:if>

    <f:link.typolink parameter="{link.link}" class="{linkClass}" additionalAttributes="{aria-label: defaultLabel}">
      <f:if condition="{link.link.title}" then="{link.link.title}" else="{defaultLabel}" />
    </f:link.typolink>

    </f:for>
  </div>
  </f:if>

  <f:if condition="{brush}">
  <div class="card-brush {item.opt_line}"> </div>
  </f:if>
</div>