<section id="team"
class="p-4 my-8 shadow-xl sm:p-8 xl:p-16"
style="background-color: {{ profile.color }}">
{% if app.user and (profile.team|length) > 0 %}
{% do section_navigation_add({ name: 'team', anchor: 'team' }) %}
<div class="container">
<div class=" mb-7">
<h2 class="text-xl font-medium text-white uppercase mb-7 md:text-xl font-headline">
{{ 'team'|trans }}
{% if user.id is defined and profile.id == user.id %}
<small class="underline lowercase">
<a data-turbo='false' target="_top" href="{{ path('profile_admin_team_index') }}">({{ 'edit'|trans }})</a>
</small>
{% endif %}
</h2>
<div class="grid gap-8 lg:grid-cols-2 xl:grid-cols-3" style="display: grid;">
{% for person in profile.team %}
<div class="grid swiper-slide">
{% include 'network/profile/components/profile_team_card.html.twig' with {
person: person
} only %}
</div>
{% endfor %}
</div>
</div>
{% elseif not app.user %}
<div class="container">
<h2 class="text-lg font-medium text-white uppercase mb-7 md:text-xl font-headline">
{{ 'team'|trans }}
</h2>
{% include 'network/profile/components/login_required_hint.html.twig' %}
</div>
{% else %}
<h2 class="text-xl font-medium text-white uppercase mb-7 md:text-xl font-headline">
{{ 'team'|trans }}
{% if user.id is defined and profile.id == user.id %}
<small class="underline lowercase">
<a data-turbo='false' target="_top" href="{{ path('profile_admin_team_index') }}">({{ 'edit'|trans }})</a>
</small>
{% endif %}
</h2>
<div class="text-white">
{{ 'no.profile.team.available'|trans }}
</div>
{% endif %}
</section>