templates/partials/generalHeader.html.twig line 1

  1. {% block laptopHeader %}
  3. <header
  4.   class="w-full navbar h-20 flex items-center sticky-header z-50 relative dark:bg-background dark:text-gray-100 transition-all"
  5. >
  6.   <nav class="container-menu mx-auto flex items-center justify-between lg:px-5 px-5">
  7.     <svg
  8.       xmlns="http://www.w3.org/2000/svg"
  9.       class="h-6 w-6 lg:hidden block menu-btn"
  10.       fill="none"
  11.       viewBox="0 0 24 24"
  12.       stroke="currentColor"
  13.       stroke-width="2"
  14.     >
  15.       <path
  16.         stroke-linecap="round"
  17.         stroke-linejoin="round"
  18.         d="M4 6h16M4 12h16M4 18h16"
  19.       />
  20.     </svg>
  21.     <div>
  22.       <a href="/" class="flex items-center">
  23.         <img class="w-auto h-12 mr-3" src="../img/bos_logo.png" alt="" />
  24.         <h6 class="text-base font-medium"></h6>
  25.       </a>
  26.     </div>
  27.     <button
  28.       type="button"
  29.       class="hover:text-blue-500 flex items-center lg:hidden"
  30.     >
  31.       {% set path = is_granted('ROLE_COMMERCE') or is_granted('ROLE_ADMIN') ? path('admin') : path('app_login') %}
  32.        <a href="{{ path }}">
  33.        <span class="lg:mr-3 mr-0 relative">
  34.         <img
  35.           class="w-8 h-8 rounded-full border border-white"
  36.           src="{{ '../images/user/' ~ app.user.imageNameUser ?? 'default.jpg'}}"
  37.           alt="{{ app.user.imageNameUser ?? 'image par défaut' }}"
  38.         />
  39.               {% if app.user %}
  40.                   <span class="w-2 h-2 bg-green-500 rounded-full border absolute bottom-0 left-0"></span>
  41.               {% else %}
  42.                   <span class="w-2 h-2 red-button rounded-full border absolute bottom-0 left-0"></span>
  43.               {% endif %}
  44.       </span>
  45.       </a>
  46.     </button>
  47.     <div class="hidden lg:flex items-center">
  48.       <ul class="flex items-center">
  49.               <li class="">
  50.           <div
  51.   class="relative [&>div] [&>div]:hover:visible [&>div]:hover:transition-all [&>div]:hover:pt-3 [&>div]:hover:h-full [&>div]:hover:opacity-100 [&>div]:hover:top-auto [&>div]:hover:z-10 pr-9"
  52. >
  53.   <button class="link hover:text-blue-500 flex items-center">
  54.     <a href="{{ path('app_home_list') }}">Accéder à la carte</a>
  55.   </button>
  56.         <li class="">
  57.           <div
  58.   class="relative [&>div] [&>div]:hover:visible [&>div]:hover:transition-all [&>div]:hover:pt-3 [&>div]:hover:h-full [&>div]:hover:opacity-100 [&>div]:hover:top-auto [&>div]:hover:z-10 pr-9"
  59. >
  60.   <button class="link hover:text-blue-500 flex items-center">
  61.     Categories
  62.     <svg
  63.       data-dropdown-button
  64.       class="w-3 h-auto ml-2"
  65.       width="10"
  66.       height="6"
  67.       viewBox="0 0 10 6"
  68.       fill="none"
  69.       xmlns="http://www.w3.org/2000/svg"
  70.     >
  71.       <path
  72.         d="M4.99982 6.00001C4.79513 6.00001 4.59034 5.92467 4.43435 5.774L0.434558 1.91686C0.122074 1.61552 0.122074 1.12735 0.434558 0.826011C0.747042 0.524671 1.25327 0.524671 1.56575 0.826011L4.99982 4.13893L8.43464 0.826613C8.74712 0.525274 9.25335 0.525274 9.56583 0.826613C9.87831 1.12795 9.87831 1.61612 9.56583 1.91746L5.56604 5.7746C5.4098 5.92527 5.20481 6.00001 4.99982 6.00001Z"
  73.         fill="currentColor"
  74.       />
  75.     </svg>
  76.   </button>
  77.   <div class="absolute top-9 invisible opacity-0 whitespace-nowrap pt-0">
  78.     <div
  79.       class="rounded-lg whitespace-nowrap shadow-front-3 bg-white dark:bg-foreground dark:text-gray-300 text-gray-700"
  80.     >
  81.       <ul
  82.         class="h-full rounded-lg relative bg-white dark:bg-foreground dark:text-gray-300 text-gray-700"
  83.       >
  84.       <!-- ALL CATEGORIES IN MENU START -->
  85.       {% for category in categorieNavbar() %}
  86.         <li
  87.           class="flex rounded-t-lg [&>a_h6]:hover:text-blue-500 [&>a:first-child]:hover:border-blue-200 [&>a:first-child]:hover:rounded-t-lg [&>a:first-child]:hover:bg-blue-50 [&>a:last-child]:hover:block bg-white dark:bg-foreground"
  88.         >
  89.           <a
  90.             href="{{ path('app_home_list_category', {id:category.id}) }}"
  91.             class="link px-3 py-2 border-b text-sm border-grey-200 dark:border-gray-800 w-full"
  92.           >
  93.             <h6 class="font-medium text-gray-600 dark:text-gray-200">
  94.               {{category.name}}
  95.             </h6>
  96.             <p class="font-normal text-gray-500 dark:text-gray-400 text-xs">
  97.               {{category.subtitle}}
  98.             </p>
  99.           </a>
  100.         </li>
  101.         {% endfor %}
  102.         <!-- ALL CATEGORIES IN MENU END -->
  103.       </ul>
  104.     </div>
  105.   </div>
  106. </div>
  108.         </li>
  109.         <li class="">
  110. <div
  111.   class="dropdown relative [&>div]:hover:visible [&>div]:hover:transition-all [&>div]:hover:pt-3 [&>div]:hover:h-full [&>div]:hover:block [&>div]:hover:opacity-100 [&>div]:hover:top-auto [&>div]:hover:z-10 pr-9"
  112. >
  113.   <button class="link hover:text-blue-500 flex items-center">
  114.     Blog
  115.     </svg>
  116.   </button>
  117.           </li>
  119.           <li class="">
  120. <div
  121.   class="dropdown relative [&>div]:hover:visible [&>div]:hover:transition-all [&>div]:hover:pt-3 [&>div]:hover:h-full [&>div]:hover:block [&>div]:hover:opacity-100 [&>div]:hover:top-auto [&>div]:hover:z-10 pr-9"
  122. >
  123.   <button class="link hover:text-blue-500 flex items-center">
  124.     Nos valeurs
  125.     </svg>
  126.   </button>
  127. </li>
  129.         <li class="mr-9">
  130.           <svg
  131.             xmlns="http://www.w3.org/2000/svg"
  132.             class="h-5 w-5 text-gray-300 cursor-pointer darkMode"
  133.             viewBox="0 0 20 20"
  134.             fill="currentColor"
  135.           >
  136.             <path
  137.               d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"
  138.             />
  139.           </svg>
  140.           <svg
  141.             xmlns="http://www.w3.org/2000/svg"
  142.             class="h-5 w-5 text-yellow-500 cursor-pointer lightMode hidden"
  143.             viewBox="0 0 20 20"
  144.             fill="currentColor"
  145.           >
  146.             <path
  147.               fill-rule="evenodd"
  148.               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"
  149.               clip-rule="evenodd"
  150.             />
  151.           </svg>
  152.         </li>
  153.  <li class="mr-9">
  154.           <div class="dropdown" data-dropdown>
  155.             <button
  156.               class="link hover:text-blue-500 flex items-center"
  157.               data-dropdown-button
  158.             >
  159.                 <img
  160.                   class="w-8 h-8 rounded-full border border-white mr-3"
  161.                   src="{{ '../images/user/' ~ app.user.imageNameUser ?? 'default.jpg'}}"
  162.                   data-dropdown-button
  163.                   alt="{{ app.user.imageNameUser ?? 'image par défaut' }}"
  164.                 />
  166.               {% if app.user %}
  167.                   <span class="w-2 h-2 bg-green-500 rounded-full border absolute bottom-0 left-0"></span>
  168.               {% else %}
  169.                   <span class="w-2 h-2 red-button rounded-full border absolute bottom-0 left-0"></span>
  170.               {% endif %}
  172.               </span>
  173.               Espace professionnel
  174.               <svg
  175.                 class="w-3 h-auto ml-2"
  176.                 width="10"
  177.                 height="6"
  178.                 data-dropdown-button
  179.                 viewBox="0 0 10 6"
  180.                 fill="none"
  181.                 xmlns="http://www.w3.org/2000/svg"
  182.               >
  183.                 <path
  184.                   d="M4.99982 6.00001C4.79513 6.00001 4.59034 5.92467 4.43435 5.774L0.434558 1.91686C0.122074 1.61552 0.122074 1.12735 0.434558 0.826011C0.747042 0.524671 1.25327 0.524671 1.56575 0.826011L4.99982 4.13893L8.43464 0.826613C8.74712 0.525274 9.25335 0.525274 9.56583 0.826613C9.87831 1.12795 9.87831 1.61612 9.56583 1.91746L5.56604 5.7746C5.4098 5.92527 5.20481 6.00001 4.99982 6.00001Z"
  185.                   fill="currentColor"
  186.                 />
  187.               </svg>
  188.             </button>
  189.             <div
  190.               class="dropdown-menu bg-white dark:bg-foreground dark:text-gray-300 text-gray-700"
  191.             >
  192.               <div>
  193.                 <div class="dropdown-links max-w-xs w-48 rounded-md py-3">
  194.                   
  195.                   {% set path = is_granted('ROLE_COMMERCE') or is_granted('ROLE_ADMIN') ? path('admin') : path('app_login') %}
  196.                   <a
  197.                     href="{{ path }}"
  198.                     class="link hover:text-blue-500 px-4 py-1 flex items-center text-sm text-gray-700 dark:text-gray-300"
  199.                     ><svg
  200.                       xmlns="http://www.w3.org/2000/svg"
  201.                       class="w-4 h-4 mr-2"
  202.                       fill="none"
  203.                       viewBox="0 0 24 24"
  204.                       stroke="currentColor"
  205.                       stroke-width="2"
  206.                     >
  207.                       <path
  208.                         stroke-linecap="round"
  209.                         stroke-linejoin="round"
  210.                         d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"
  211.                       /></svg
  212.                     >Mon compte
  213.                   </a>
  214.                   <a
  215.                     href="#"
  216.                     class="link hover:text-blue-500 px-4 py-1 flex items-center text-sm text-gray-700 dark:text-gray-300"
  217.                   >
  218.                     <svg
  219.                       xmlns="http://www.w3.org/2000/svg"
  220.                       class="h-4 w-4 mr-2"
  221.                       fill="none"
  222.                       viewBox="0 0 24 24"
  223.                       stroke="currentColor"
  224.                       stroke-width="2"
  225.                     >
  226.                       <path
  227.                         stroke-linecap="round"
  228.                         stroke-linejoin="round"
  229.                         d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z"
  230.                       />
  231.                     </svg>
  232.                     Nos offres
  233.                   </a>
  234.                   {% if app.user %}
  235.                   <a
  236.                     href="{{ path('app_logout')}}"
  237.                     class="link hover:text-blue-500 px-4 py-1 flex items-center text-sm text-gray-700 dark:text-gray-300"
  238.                   >
  239.                     <svg
  240.                       xmlns="http://www.w3.org/2000/svg"
  241.                       class="w-4 h-4 mr-2"
  242.                       fill="none"
  243.                       viewBox="0 0 24 24"
  244.                       stroke="currentColor"
  245.                       stroke-width="2"
  246.                     >
  247.                       <path
  248.                         stroke-linecap="round"
  249.                         stroke-linejoin="round"
  250.                         d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"
  251.                       />
  252.                     </svg>
  253.                     Déconnexion
  254.                   </a>
  255.                   {% endif %}
  256.                 </div>
  257.               </div>
  258.             </div>
  259.           </div>
  260.         </li>
  261.       </ul>
  262.       <a href="{{ path('app_shop_new') }}">
  263.       <button
  264.         type="button"
  265.         class="inline-flex hover:bg-blue-500 hover:text-white items-center px-3 py-[9px] rounded-lg border hover:border-blue-100"
  266.       >
  267.         <svg
  268.           xmlns="http://www.w3.org/2000/svg"
  269.           class="h-4 w-4 xl:mr-2 mr-0"
  270.           viewBox="0 0 20 20"
  271.           fill="currentColor"
  272.         >
  273.           <path
  274.             fill-rule="evenodd"
  275.             d="M10 3a1 1 0 011 1v5h5a1 1 0 110 2h-5v5a1 1 0 11-2 0v-5H4a1 1 0 110-2h5V4a1 1 0 011-1z"
  276.             clip-rule="evenodd"
  277.           />
  278.         </svg>
  279.         <span class="xl:block hidden">Ajouter un commerce</span>
  280.       </button>
  281.       </a>
  282.     </div>
  283.   </nav>
  284. </header>
  286. {% endblock %}