set front

This commit is contained in:
jleroy2023
2024-11-18 14:41:52 +01:00
parent 9bdde39dde
commit 8f75b8a125
30 changed files with 2650 additions and 18 deletions

View File

@@ -0,0 +1,130 @@
<nav class="relative px-4 py-4 flex justify-between items-center border-b-2 border-light-secondary dark:border-dark-secondary-secondary">
<a class="text-3xl font-bold leading-none" href="{{path('home_index')}}">
{% include "base/banner-svg.html.twig" with {'classes': 'h-12 fill-gray-700 dark:fill-light-font'} %}
</a>
<div class="lg:hidden">
<button class="navbar-burger flex items-center text-light-primary dark:text-dark-primary p-3">
<svg class="block h-4 w-4 fill-current" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<title>Mobile menu</title>
<path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"></path>
</svg>
</button>
</div>
<ul class="hidden absolute top-1/2 left-1/2 transform -translate-y-1/2 -translate-x-1/2 lg:mx-auto lg:flex lg:items-center lg:w-auto lg:space-x-6">
<li><a class="text-sm {% if app.request.get('_route') == 'home_index' %} font-bold text-light-primary dark:text-dark-primary {% else %} dark:text-light-font {% endif %}" href="{{path('home_index')}}">Accueil</a></li>
<li class="text-light-primary dark:text-dark-primary">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" class="w-4 h-4 current-fill"
viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M12 5v0m0 7v0m0 7v0m0-13a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"></path>
</svg>
</li>
<li><a class="text-sm text-gray-700 {% if app.request.get('_route') == 'outing_index' %} font-bold text-light-primary dark:text-dark-primary {% else %} dark:text-light-font {% endif %}" href="{{path('outing_index')}}">Sorties</a></li>
<li class="text-light-primary dark:text-dark-primary">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" class="w-4 h-4 current-fill"
viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M12 5v0m0 7v0m0 7v0m0-13a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"></path>
</svg>
</li>
<li><a class="text-sm text-gray-700 {% if app.request.get('_route') == 'outing_create' %} font-bold text-light-primary dark:text-dark-primary {% else %} dark:text-light-font {% endif %}" href="{{ path('outing_create')}}">Nouvelle sortie</a></li>
<li class="text-light-primary dark:text-dark-primary">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" class="w-4 h-4 current-fill"
viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M12 5v0m0 7v0m0 7v0m0-13a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"></path>
</svg>
</li>
<li><a class="text-sm text-gray-700 {% if app.request.get('_route') == 'group_index' %} font-bold text-light-primary dark:text-dark-primary {% else %} dark:text-light-font {% endif %}" href="{{ path('group_index') }}">Mes groupes</a></li>
{% if is_granted('ROLE_ADMIN') %}
<li class="text-light-primary dark:text-dark-primary">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" class="w-4 h-4 current-fill"
viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M12 5v0m0 7v0m0 7v0m0-13a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z"></path>
</svg>
</li>
<li><a class="text-sm text-gray-700 dark:text-light-font" href="{{ path('admin') }}">Administration</a></li>
{% endif %}
</ul>
{% if app.user %}
<div class="hidden lg:inline-block lg:ml-auto lg:mr-3 py-2 transition duration-200">
<a href="{{ path('user_index')}}">
<img class= "object-cover rounded-full border
border-gray-100 shadow-sm
h-full cursor-pointer dark:border-dark-primary" src="{{ app.user.getProfilePicture() ? asset('uploads/' ~ app.user.getProfilePicture()) | imagine_filter('profile_navbar') : asset('profilDefault.png') | imagine_filter('profile_navbar') }}" alt=""/>
</a>
</div>
{% else %}
<a class="hidden lg:inline-block lg:ml-auto lg:mr-3 py-2 px-6 bg-light-primary dark:bg-dark-primary hover:bg-light-primary/75 dark:hover:bg-dark-primary/75 text-sm text-white rounded-xl transition duration-200"
href="{{ path('app_login') }}">Se connecter</a>
{% endif %}
<button id="theme-toggle" type="button"
class="hidden lg:inline-block text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5">
<svg id="theme-toggle-dark-icon" class="hidden w-5 h-5" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path>
</svg>
<svg id="theme-toggle-light-icon" class="hidden w-5 h-5" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z"
fill-rule="evenodd" clip-rule="evenodd"></path>
</svg>
</button>
</nav>
<div class="navbar-menu relative z-50 hidden">
<div class="navbar-backdrop fixed inset-0 bg-gray-800 opacity-25"></div>
<nav class="fixed top-0 left-0 bottom-0 flex flex-col w-5/6 max-w-sm py-6 px-6 bg-light-font dark:bg-dark-font border-r overflow-y-auto">
<div class="flex items-center mb-8">
<a class="mr-auto text-3xl font-bold leading-none" href="{{ path('home_index') }}">
{% include "base/banner-svg.html.twig" with {'classes': 'h-12 fill-gray-700 dark:fill-light-font'} %}
</a>
<button class="navbar-close">
<svg class="h-6 w-6 text-gray-400 cursor-pointer hover:text-gray-500" xmlns="http://www.w3.org/2000/svg"
fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M6 18L18 6M6 6l12 12"></path>
</svg>
</button>
</div>
<div>
<ul>
<li class="mb-1">
<a class="block p-4 text-sm font-semibold text-gray-700 dark:text-light-font dark:hover:text-gray-700 hover:bg-light-secondary dark:hover:bg-dark-secondary rounded"
href="{{ path('home_index') }}">Accueil</a>
</li>
<li class="mb-1">
<a class="block p-4 text-sm font-semibold text-gray-700 dark:text-light-font dark:hover:text-gray-700 hover:bg-light-secondary dark:hover:bg-dark-secondary rounded"
href="{{ path('outing_index') }}">Sorties</a>
</li>
<li class="mb-1">
<a class="block p-4 text-sm font-semibold text-gray-700 dark:text-light-font dark:hover:text-gray-700 hover:bg-light-secondary dark:hover:bg-dark-secondary rounded"
href="{{ path('outing_create') }}">Nouvelle sortie</a>
</li>
<li class="mb-1">
<a class="block p-4 text-sm font-semibold text-gray-700 dark:text-light-font dark:hover:text-gray-700 hover:bg-light-secondary dark:hover:bg-dark-secondary rounded"
href="{{ path('group_index') }}">Mes groupes</a>
</li>
</ul>
</div>
<div class="mt-auto mb-5">
<div class="pt-6 mx-auto">
{% if app.user %}
<a href="{{ path('user_index')}}">
<img class= "flex object-cover rounded-full border
border-gray-100 shadow-sm
h-full cursor-pointer dark:border-dark-primary" src="{{ app.user.getProfilePicture() ? asset('uploads/' ~ app.user.getProfilePicture()) | imagine_filter('profile_navbar') : asset('profilDefault.png') | imagine_filter('profile_navbar') }}" alt=""/>
<p class="text-light-primary dark:text-light-font font-bold">{{ app.user.pseudo }}</p>
</a>
{% else %}
<a class="block px-4 py-3 mb-2 leading-loose text-center bg-light-primary dark:bg-dark-primary hover:bg-light-primary/75 dark:hover:bg-dark-primary/75 text-sm text-white rounded-xl"
href="{{ path('app_login') }}">Se connecter</a>
{% endif %}
</div>
</div>
</nav>
</div>