<div class="user">
    <div class="flex">
        <img class="avatar medium" src="{{ user.avatar }}" alt="{{ "{{ name}}'s avatar'" | _(name=user.name) }}">

        <h1 class="grow">
            {{ user.name }}

            <small>@{{ user.fqn }}</small>

            {% if user.is_admin %}
                <span class="badge">{{ "Admin" | _ }}</span>
            {% endif %}

            {% if is_self %}
                <span class="badge">{{ "It is you" | _ }}</span>
            {% endif %}
        </h1>
    </div>

    {% if is_self %}
        <a href="/@/{{ user.username }}/edit" class="button inline-block">{{ "Edit your profile" | _ }}</a>
    {% endif %}

    {% if is_remote %}
        <a class="inline-block button" href="{{ user.ap_url }}" target="_blank">{{ "Open on {{ instance_url }}" | _(instance_url=instance_url) }}</a>
    {% endif %}

    {% set not_self = not is_self %}
    {% if not_self and (account is defined) %}
        {% if follows %}
            <a href="/@/{{ user.fqn }}/follow/" class="inline-block button">{{ "Unfollow" | _ }}</a>
        {% else %}
            <a href="/@/{{ user.fqn }}/follow/" class="inline-block button">{{ "Follow" | _ }}</a>
        {% endif %}
    {% endif %}
</div>

<div>
    <a href="/@/{{ user.fqn }}/followers/">{{ "{{ count }} followers" | _n(singular="One follower", count=n_followers) }}</a>
</div>
