{% extends "base.html" %}
{% load static %}
{% load tailwind_forms %}

{% block title %}Member settings · {{ team.name }}  · {{ site_title }}{% endblock %}

{% block content %}


<div class="flex items-center justify-center">

    <div class="m-4 max-w-4xl flex-auto">
        <form action="" method="post">
        {% csrf_token %}

        {% if messages %}
        <ul>
            {% for message in messages %}
                {# if we introduce different levels we can use{% message.level == DEFAULT_MESSAGE_LEVELS.SUCCESS %} #}
                <li class="bg-cyan-50 border-2 border-cyan-800 p-4 rounded-lg">{{ message }}</li>
            {% endfor %}
        </ul>
        {% endif %}

        <div>
            <h1 class="text-4xl my-4 font-bold">Membership settings</h1>
        </div>

        <div class="mt-4 mb-4">
            {% if this_is_you %}
                Your membership settings for team "{{ team.name }}".
            {% else %}
                Settings for team "{{ team.name }}" and user {{ user.username }}.
            {% endif %}
        </div>

        {% tailwind_formfield form.role %}
        {% tailwind_formfield form.send_email_alerts %}

        <button class="font-bold text-slate-800 border-slate-500 pl-4 pr-4 pb-2 pt-2 border-2 bg-cyan-200 hover:bg-cyan-400 active:ring rounded-md">Save</button>
        {% if this_is_you %}
            <a href="{% url "team_list" %}" class="text-cyan-500 font-bold ml-2">Cancel</a> {# not quite perfect, because "you" can also click on yourself in the member list #}
        {% else %}
            <a href="{% url "team_members" team_pk=team.pk %}" class="text-cyan-500 font-bold ml-2">Cancel</a>
        {% endif %}
        </form>

    </div>

</div>


{% endblock %}
