add base template + mainController

2024-11-18 15:52:10 +01:00
parent e0935ec69d
commit e5307da3e1
6 changed files with 183 additions and 0 deletions
--- a/templates/main/header.html.twig
+++ b/templates/main/header.html.twig
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html lang="fr">
+<head>
+    <meta charset="UTF-8">
+    <title>Sortie</title>
+    {% block stylesheets %}
+        {{ encore_entry_link_tags('app') }}
+    {% endblock %}
+</head>
+
+<body>
+<div class="mx-auto">
+    <nav class="flex justify-between items-center py-4 bg-gray-100 shadow-md">
+        <!-- Titre + Logo -->
+        <a href="/">
+            <div class="flex items-center space-x-3 pl-4">
+                <h3 class="text-2xl font-bold">Sortie</h3>
+                <img src="{{ asset('img/logo.png') }}" alt="Logo" class="h-10">
+            </div>
+        </a>
+        <!-- Liens de navigation -->
+        <div class="relative">
+            <button 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-bar.png') }}">
+            </button>
+            <ul id="navbar" class="hidden absolute top-12 right-0 w-48 bg-white shadow-md p-4 flex-col space-y-4">
+                <li><a href="/" class="text-gray-700 font-bold hover:text-blue-500">Accueil</a></li>
+                <li><a href="/" class="text-gray-700 font-bold hover:text-blue-500">Sortie</a></li>
+                <li><a href="/" class="text-gray-700 font-bold hover:text-blue-500">ToDo</a></li>
+                <li><a href="/" class="text-gray-700 font-bold hover:text-blue-500">À propos</a></li>
+                {#        <li><a href="#Contact" class="text-gray-700 font-bold hover:text-blue-500">Contact</a></li>#}
+{#                {% if app.user %}#}
+{#                    <li><a href="{{ path('auth_logout') }}" class="text-gray-700 font-bold hover:text-blue-500">Se déconnecter</a></li>#}
+{#                {% else %}#}
+{#                    <li><a href="{{ path('auth_register') }}" class="text-gray-700 font-bold hover:text-blue-500">S'inscrire</a></li>#}
+{#                    <li><a href="{{ path('auth_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>