{% load static %}

<tr>
    <td title="{{link.timestamp}}"> {% if link.bookmarked_date  %} {{ link.bookmarked_date }} {% else %} {{ link.added }} {% endif %} </td>
    <td class="title-col">
        {% if link.is_archived %}
            <a href="archive/{{link.timestamp}}/index.html"><img src="archive/{{link.timestamp}}/favicon.ico" class="link-favicon" decoding="async"></a>
        {% else %}
            <a href="archive/{{link.timestamp}}/index.html"><img src="{% static 'spinner.gif' %}" class="link-favicon" decoding="async"></a>
        {% endif %}

        <a href="archive/{{link.timestamp}}/index.html" title="{{link.title}}">
            <span data-title-for="{{link.url}}" data-archived="{{link.is_archived}}">{{link.title|default:'Loading...'}}</span>
            {% if link.tags_str %}
                <span class="tags" style="float: right; border-radius: 5px; background-color: #bfdfff; padding: 2px 5px; margin-left: 4px; margin-top: 1px;">
                    {% if link.tags_str != None %}
                        {{link.tags_str|default:''}}
                    {% else %}
                        {{ link.tags|default:'' }}
                    {% endif %}
                </span>
            {% endif %}
        </a>
    </td>
    <td>
        <a href="archive/{{link.timestamp}}/index.html">📄 
            <span data-number-for="{{link.url}}" title="Fetching any missing files...">
                {% if link.icons  %}
                    {{link.icons}}
                {% else %}
                    {{link.num_outputs}} <img src="{% static 'spinner.gif' %}" class="files-spinner" decoding="async"/>
                {% endif %}
            </span>
        </a>
    </td>
   <td style="text-align:left"><a href="{{link.url}}">{{link.url}}</a></td>
</tr>