{% macro header(s) %}
    <td class="nopadding" colspan="{{desktop('2')}}">
        <strong class="extrabold h4 success top-25-in bottom-10-in block">{{s}}</strong>
    </td>
{% endmacro %}

{% macro cell(name, value, longtext = false) %}
    {% if isMobile() %}
        <td class=""><span class="regular upper p-alt">{{name}}</span>
        <br><span class="semibold">{{ value }}</span></td>
    {% else %}

        <th class="regular upper" colspan="{{longtext ? 2}}">
            <span class="underline">{{name}}</span>
            {% if longtext %}
            <div class="regular w100 top-20">
                {{value|nl2br}}
            </div>
            {% endif %}
        </th>
        {% if not longtext %}
        <td class="left-20-in vt-5-in">
            <span class="semibold h4">{{ value }}</span>
        </td>
        {% endif %}
    {% endif %}
{% endmacro %}

{% macro doc(doc) %}
{% set t = doc.target|split(".") %}
{% set ext = t[t|length-1]|upper %}
{% set readLink = path("file-read",{id:doc.id}) %}
{% set downloadLink = path("file-download",{id:doc.id}) %}

{% set action = null %}
{% if 'pdf' in doc.mimetype|lower %}
{% set action = 'os-read' %}
{% elseif 'image' in doc.mimetype|lower %}
{% set action = 'os-image' %}
{% elseif 'video' in doc.mimetype|lower %}
{% set action = 'os-video' %}
{% endif %}

<td class="regular upper" colspan="2">
    <div class="flex row space middle">
        <span>{{doc.mimetype}}{{doc.name}}</span>
        <span class="flex row space middle">
            {% if action %}
            <span class="{{action}} flex row middle bg-success white radius-5 hz-10-in vt-10-in {{desktop('')}}{{mobile('')}}" data-target='{{readLink}}'>
                <span class="fa fa-eye"></span>
            </span>
            {% endif %}
            <a class="flex row middle bg-success white radius-5 hz-10-in vt-10-in {{desktop('left-10')}}{{mobile('')}}" href='{{path("file-download",{id:doc.id})}}' target='_blank' download>
                <span class="fa fa-download"></span>
            </a>
        </span>
    </div>
</td>
{% endmacro %}