{% load gravatar %}
{% load static %}
<div class="list-group-item activity-strip overflow-auto">
    <div class="activity-strip-section">
        {% if activity.user.userprofile.avatar %}
            <img src="{{ activity.user.userprofile.avatar }}" width="100" class="img-responsive img-rounded">
        {% elif activity.user.socialaccount_set.all.0.get_avatar_url %}
            <img src="{{ activity.user.socialaccount_set.all.0.get_avatar_url }}" width="100"
                 class="img-responsive img-rounded">
        {% elif activity.user.email %}
            <img src="{% gravatar_url activity.user.email 100 %}" width="100" class="img-responsive img-rounded">
        {% else %}
            <img src="{% static 'images/dummy-user.png' %}" width="100"
                 class="img-responsive img-rounded">
        {% endif %}

        <div class="info">
            <a href="/domain/{{ activity.domain_name }}">
                <img src="http://www.{{ activity.domain_name }}/favicon.ico" height="25"
                     onerror="this.onerror=null; this.style.display='none';">
            </a>
            <a href="{{ activity.get_absolute_url }}">{{ activity.description|truncatechars:100 }}</a>

            <div class="small">
                <a href="{{ activity.user.get_absolute_url }}" data-toggle="popover"
                   data-tag="{{ activity.user.userprofile.get_title_display }}">
                    {{ activity.user|default:"Anonymous" }}
                </a>
                found a bug on <a
                    href="/domain/{{ activity.domain_name }}">{{ activity.domain_title }}</a> {{ activity.created|timesince }}
                ago
            </div>
            <a class="whitespace-nowrap" href="{{ activity.get_absolute_url }}#comments">
                {% if activity.comments.all|length > 0 %}
                    {{ activity.comments.all|length }} comments
                {% endif %}
            </a>
            {% if activity.status == "open" %}
            <span class="label label-success text-capitalize !leading-loose">{{ activity.status }}</span>
        {% else %}
            <span class="label label-danger text-capitalize !leading-loose">{{ activity.status }}</span>
        {% endif %}
        <span class="label label-info !leading-loose">{{ activity.get_label_display }}</span>
        </div>
    </div>
    <div class="activity-screenshot">

        {% for screenshot_activity,screenshot in activity_screenshots.items %}
            {% if activity == screenshot_activity %}
                <a href="{{ activity.get_absolute_url }}">
                    <img src="{{ screenshot.image.url }}">
                </a>
            {% endif %}
        {% endfor %}

        {% if activity.screenshot %}
            <a href="{{ activity.get_absolute_url }}">
                <img src="{{ activity.screenshot.url }}">
            </a>
        {% endif %}
    </div>
</div>