misuzu/templates/profile/_layout/header.twig

{% from 'macros.twig' import avatar %}
{% from '_layout/input.twig' import input_checkbox_raw %}

<div class="container profile__header"{% if profile_colour is defined %} style="--accent-colour: {{ profile_colour }}"{% endif %}>
    <div class="profile__header__background"></div>

    <div class="profile__header__details">
        <div class="profile__header__avatar">
            {% if profile_is_editing and perms.edit_avatar %}
                <label class="profile__header__avatar__image profile__header__avatar__image--edit" for="avatar-selection">
                    {{ avatar(profile_user.id, 120, profile_user.name, {'id': 'avatar-preview'}) }}
                </label>

                <div class="profile__header__avatar__options">
                    <label class="input__button profile__header__avatar__option" for="avatar-selection">
                        Select
                    </label>

                    {{ input_checkbox_raw('avatar[delete]', false, 'profile__header__avatar__check', '', false, {'id':'avatar-delete'}) }}
                    <label class="input__button profile__header__avatar__option profile__header__avatar__option--delete"
                        for="avatar-delete">
                        Remove
                    </label>
                </div>
            {% else %}
                <div class="profile__header__avatar__image">
                    {{ avatar(profile_user.id|default(0), 120, profile_user.name|default('')) }}
                </div>
            {% endif %}
        </div>

        <div class="profile__header__details__content">
            {% if profile_user is defined %}
                <div class="profile__header__username">
                    {{ profile_user.name }}
                </div>

                {% if profile_user.title is not empty %}
                    <div class="profile__header__title">
                        {{ profile_user.title }}
                    </div>
                {% endif %}

                {% set hasCountryCode = profile_user.countryCode != 'XX' %}
                {% set age = profile_user.age %}
                {% set hasAge = age > 0 %}
                {% if hasCountryCode or hasAge %}
                    <div class="profile__header__country">
                        {% if hasCountryCode %}<div class="flag flag--{{ profile_user.countryCode|lower }}"></div>{% endif %}
                        <div class="profile__header__country__name">
                            {% if hasCountryCode %}{{ profile_user.countryCode|country_name }}{% endif %}{% if hasAge %}{% if hasCountryCode %}, {% endif %}{{ age }} year{{ age != 's' ? 's' : '' }} old{% endif %}
                        </div>
                    </div>
                {% endif %}
            {% else %}
                <div class="profile__header__username">
                    User not found!
                </div>
                <div class="profile__header__title">
                    Check the link and try again.
                </div>
            {% endif %}
        </div>
    </div>

    <div class="profile__header__options">
        {% if profile_user is defined %}
            <div class="profile__header__actions">
                {% if profile_mode is empty %}
                    {% if profile_is_editing %}
                        <button class="input__button input__button--save profile__header__action">Save</button>
                        <a href="{{ url('user-profile', {'user': profile_user.id}) }}" class="input__button input__button--destroy profile__header__action">Discard</a>
                        <a href="{{ url('settings-index') }}" class="input__button profile__header__action">Settings</a>
                    {% else %}
                        {% if profile_can_edit %}
                            <a href="{{ url('user-profile-edit', {'user': profile_user.id}) }}" class="input__button profile__header__action">Edit Profile</a>
                        {% endif %}
                        {% if profile_can_send_messages %}
                            <a href="{{ url('messages-compose', {'recipient': profile_user.name}) }}" class="input__button profile__header__action">Send Message</a>
                        {% endif %}
                    {% endif %}
                {% else %}
                    <a href="{{ url('user-profile', {'user': profile_user.id}) }}" class="input__button profile__header__action">Return</a>
                {% endif %}
            </div>
        {% endif %}

        {% if stats is defined %}
            <div class="profile__header__stats">
                {% for stat in stats %}
                    {% if stat.value|default(0) > 0 %}
                        {% set is_date = stat.is_date|default(false) %}
                        {% set is_url = stat.url is defined %}
                        {% set active_class = stat.active|default(false) ? ' profile__header__stat--active' : '' %}

                        {% if is_url %}
                            <a class="profile__header__stat profile__header__stat--link{{ active_class }}" href="{{ stat.url }}">
                        {% else %}
                            <div class="profile__header__stat{{ active_class }}{% if is_date %} profile__header__stat--date" title="{{ stat.value|date('r') }}{% endif %}">
                        {% endif %}
                            <div class="profile__header__stat__name">
                                {{ stat.title }}
                            </div>

                            {% if is_date %}
                                <time class="profile__header__stat__value" datetime="{{ stat.value|date('c') }}">
                                    {{ stat.value|time_format }}
                                </time>
                            {% else %}
                                <div class="profile__header__stat__value">
                                    {{ stat.value|number_format }}
                                </div>
                            {% endif %}
                        {% if is_url %}</a>{% else %}</div>{% endif %}
                    {% endif %}
                {% endfor %}
            </div>
        {% endif %}
    </div>
</div>

{% if profile_is_banned %}
    <div class="warning warning--red warning--bigger">
        <div class="warning__content">
            This user has been banned {% if profile_ban_info.permanent %}<strong>permanently</strong>{% else %}for <strong title="{{ profile_ban_info.expiresTime|date('r') }}">{{ profile_ban_info.remainingString }}</strong>{% endif %} since <strong><time datetime="{{ profile_ban_info.createdTime|date('c') }}" title="{{ profile_ban_info.createdTime|date('r') }}">{{ profile_ban_info.createdTime|time_format }}</time></strong>.
            {% if not profile_is_guest and profile_ban_info.publicReason is not empty %}
                <p>Reason: {{ profile_ban_info.publicReason }}</p>
            {% endif %}
        </div>
    </div>
{% endif %}