{% load thumbnail %}
{% load static %}
{% load user_tags %}
<style>
    div.icon_mm1 {
        display: inline-block;
        height: 20px;
        width: 20px;
        margin-right: 5px;
        background-size: cover;
        background: url('/static/img/menu2.png') no-repeat 0 0;
    }

    div.icon_mm2 {
        display: inline-block;
        height: 20px;
        width: 20px;
        margin-right: 5px;
        background-size: cover;
        background: url('/static/img/menu2.png') no-repeat 0 -20px;
    }

</style>
<div class="message messd user-block" id="userBlock{{ contact.pk }}" data-id="{{ contact.pk }}">
    <div class="imgMess">
        {% if contact.avatar %}
            {% thumbnail contact.avatar "60x60" crop="center" as im %}
                <img src="{{ im.url }}" alt="mess-image">
            {% endthumbnail %}
        {% else %}
            <img src="{% static 'img/profile.jpg' %}" alt="mess-image">
        {% endif %}
    </div>
    <p class="nameMess">
        {% if contact.is_contractor %}
            {% url "users:contractor-profile" pk=contact.pk as contact_url %}
        {% else %}
            {% url "users:customer-profile-open-projects" pk=contact.pk as contact_url %}
        {% endif %}
    <div style="display: flex; align-items: center">
        {% if request.user.is_contractor %}
            <div class="icon_mm1"></div>
        {% else %}
            <div class="icon_mm2"></div>
        {% endif %}
        <a href="{{ contact_url }}" style="color:black;">{{ contact.username }}</a>
    </div>
    </p>

    <a href="#" data-id="{{ contact.id }}" class="conMess">Контакты</a>
    <span class="contact-count-{{ contact.pk|add:request.user.pk }}">
                                        {% get_new_count_for_contact contact request.user %}</span>
    <a href="#" class="deleteMess" data-recipent-id="{{ contact.pk }}">
        Удалить контакт
    </a>
</div>