Files
ENI-sortir/templates/main/header.html.twig
2024-11-25 16:23:56 +01:00

61 lines
2.9 KiB
Twig

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
{% block stylesheets %}
{{ encore_entry_link_tags('app') }}
{% endblock %}
</head>
<body>
<div class="mx-auto">
<nav class="flex justify-between items-center py-4 shadow-md" style="background-color: #2a8d57;">
<!-- Titre + Logo -->
<a href="/">
<div class="flex items-center space-x-3 pl-4">
<h3 class="text-3xl text-white font-bold">Sortie</h3>
<img src="{{ asset('img/logo.svg') }}" alt="Logo" class="h-10">
</div>
</a>
<div class="relative">
{% if app.user %}
<div id="menu-button" class="w-full flex justify-center">
<div class="relative">
<img src="{{ profile.fileName ? asset('upload/image/profile/' ~ profile.fileName) : asset('upload/image/profile/default.png') }}"
class="w-16 h-16 rounded-full mr-4" />
</div>
</div>
{% else %}
<button style="height:64px; width: 64px;" id="menu-button" class="p-2 pr-4 text-gray-700 font-bold hover:text-blue-500 focus:outline-none">
<img alt="burger-menu" src="{{ asset('img/burger-menu.svg') }}">
</button>
{% endif %}
<ul id="navbar" class="hidden absolute top-20 right-0 w-max bg-white shadow-md p-4 pl-2 flex-col space-y-4">
<li><a href="{{ path('home') }}" class="text-gray-700 font-bold hover:text-blue-500">Accueil</a></li>
<li><a href="{{ path('participants') }}" class="text-gray-700 font-bold hover:text-blue-500">Participants</a></li>
{% if app.user %}
<li><a href="{{ path('profile_view', {'uuid': app.user.idParticipant}) }}" class="text-gray-700 font-bold hover:text-blue-500">Mon profile</a></li>
{% endif %}
{% if app.user and ('ROLE_ADMIN' in app.user.roles) %}
<li><a href="{{ path('app_admin') }}" class="text-gray-700 font-bold hover:text-blue-500">Administration</a></li>
{% endif %}
{% if app.user %}
<li><a href="{{ path('app_logout') }}" class="text-gray-700 font-bold hover:text-blue-500">Se déconnecter</a></li>
{% else %}
<li><a href="{{ path('app_register') }}" class="text-gray-700 font-bold hover:text-blue-500">S'inscrire</a></li>
<li><a href="{{ path('app_login') }}" class="text-gray-700 font-bold hover:text-blue-500">Se connecter</a></li>
{% endif %}
</ul>
</div>
</nav>
</div>
</body>
<script>
document.getElementById('menu-button').addEventListener('click', function () {
const navbar = document.getElementById('navbar');
navbar.classList.toggle('hidden');
});
</script>
</html>