templates/layout/navigation/canvasmenu.html.twig line 1

Open in your IDE?
  1. {% set navmobilepages = build_main_nav(document).pages|filter(page => page.visible) %}
  2. {% set topbarpages = build_property_nav(document, 'navigationTopbar').pages|filter(page => page.visible) %}
  3. {% set userpages = build_property_nav(document, 'navigationUser').pages|filter(page => page.visible) %}
  5. <div class="flex flex-col content-between h-full max-h-[100vh]">
  6. <div class="flex flex-col flex-1 w-full overflow-y-scroll">
  7.   {# Header Menue #}
  8.   {% if localized_links(document, app.request.locale)|length > 1 or app.user %}
  9.   <div class="flex items-center justify-between p-10 pb-0 lg:hidden">
  10.     {# LOGO #}
  13.     <div class="flex items-center justify-around ">
  14.       {% include 'layout/navigation/language.html.twig' %}
  15.     </div>
  17.     <div class="flex items-center space-x-4">
  18.       {# Mobile Menu Button #}
  19.       <div class="w-16 h-16 pt-1">
  20.         {% if app.user %}
  21.           <a class="flex justify-end gap-4 my-2 mb-3 text-xl text-black uppercase"
  22.             href="{{ pimcore_url({ object: app.user }) }}">
  23.             {% include 'component/avatar.html.twig' with {
  24.             avatar: app.user.avatar,
  25.             initials: app.user.name|initials,
  26.             size: 'tiny'
  27.           } only %}
  28.           </a>
  29.         {% endif %}
  31.       </div>
  32.     </div>
  33.   </div>
  34. {% endif %}
  35.   {# Menu Mobile #}
  36.   <div class="flex flex-col px-10 ">
  37.     {# Navigation #}
  41.     <ul class="flex flex-col flex-1 py-6 ">
  42.       {% for page in navmobilepages %}
  43.         <li class="p-2 text-lg text-white border-b border-neutral-800">
  44.           <a class="{{ page.active ? 'font-medium' : '' }}"
  45.             href="{{ page.href }}"
  46.             target="{{ page.target }}">
  47.             {{ page.label|capitalize }}
  48.           </a>
  49.         </li>
  50.       {% endfor %}
  51.       {# Topbar Nav Elements #}
  52.       {% for page in topbarpages %}
  53.         <li class="p-2 text-lg text-white border-b border-neutral-800">
  54.           <a class="{{ page.active ? 'font-medium' : '' }}"
  55.             href="{{ page.href }}"
  56.             target="{{ page.target }}">
  57.             {{ page.label|capitalize }}
  58.           </a>
  59.         </li>
  60.       {% endfor %}
  61.       {% for page in userpages %}
  62.         <li class="p-2 text-lg text-white border-b border-neutral-800">
  63.           <a class="{{ page.active ? 'font-medium' : '' }}"
  64.             href="{{ page.href }}"
  65.             target="{{ page.target }}">
  66.             {{ page.label|capitalize }}
  67.           </a>
  68.         </li>
  69.       {% endfor %}
  70.     </ul>
  73.   </div>
  74. </div>
  77.  {% if app.user %}
  78.       <div class="px-8 py-3 bg-primary">
  79.         {# <a class="flex gap-4 my-2 mb-3 text-xl text-black uppercase"
  80.           href="{{ pimcore_url({ object: app.user }) }}">
  81.           {% include 'component/avatar.html.twig' with {
  82.           avatar: app.user.avatar,
  83.           initials: app.user.name|initials,
  84.           size: 'tiny'
  85.         } only %}
  86.           {{ app.user.name }}
  87.         </a> #}
  89.         <ul class="flex justify-between gap-8 mx-auto text-xl text-black ">
  90.           {# <li>
  91.             <a href="{{ path('profile_messages_index') }}">
  92.               {{ 'navigation.messages'|trans }}
  93.             </a>
  94.           </li> #}
  95.           <li>
  96.             <a class="font-headline text-xs gap-2 grid justify-center items-center justify-items-center {{
  97.               app.request.get('_route') == 'network_activity'
  98.                 ? 'font-medium'
  99.                 : ''
  100.               }}"
  101.               href="{{ path('network_activity') }}">
  102.               <div>{% include "icons/network.svg.twig" with {class: 'w-6 h-6 mt-2'} %}</div>
  103.               <div>{{ 'navigation.my-network'|trans }}</div>
  105.             </a>
  106.           </li>
  107.           {# <li>
  108.             <a href="{{ pimcore_url({ object: app.user }) }}">
  109.               {{ 'navigation.my-profile'|trans }}
  110.             </a>
  111.           </li> #}
  112.           <li>
  113.             <a class=" text-xs gap-2 grid justify-center items-center justify-items-center {{
  114.               app.request.get('_route') == 'profile_admin_index'
  115.                 ? 'font-medium'
  116.                 : ''
  117.               }}"
  118.               href="{{ path('profile_admin_index') }}">
  119.               <div>{% include "icons/edit.svg.twig" with {class: 'w-6 h-6 mt-2'} %}</div>
  120.               <div>{{ 'navigation.manage-profile'|trans }}</div>
  123.             </a>
  124.           </li>
  125.           <li>
  126.             <a class="font-headline text-xs gap-2 grid justify-center items-center justify-items-center {{
  127.               app.request.get('_route') == 'auth_logout'
  128.                 ? 'font-medium'
  129.                 : ''
  130.               }}"
  131.               href="{{ path('auth_logout') }}">
  132.               <div>{% include "icons/logout.svg.twig" with {class: 'w-6 h-6 mt-2'} %}</div>
  133.               <div>{{ 'navigation.logout'|trans }}</div>
  135.             </a>
  136.           </li>
  137.         </ul>
  138.       </div>
  139.     {% else %}
  140.       {# <ul class="pb-6 my-5 mb-6 text-white border-b-2 border-white">
  141.         <li>
  142.           <a class="flex gap-4 my-2 mb-6 text-xl text-black uppercase btn btn-sm btn-white place-items-center"
  143.             href="{{ path('auth_login') }}">
  144.             {% include 'icons/myprofile.svg.twig' with { class: 'h-6 w-6 text-primary -mt-1' } %} {{ 'navigation.login'|trans }}
  145.           </a>
  146.         </li>
  147.         <li>
  148.           <a class="font-headline mx-auto text-xl {{
  149.             app.request.get('_route') == 'auth_register'
  150.               ? 'font-medium'
  151.               : ''
  152.             }}"
  153.             href="{{ path('auth_register') }}">
  154.             {{ 'navigation.register'|trans }}
  155.           </a>
  156.         </li>
  157.       </ul> #}
  158.       <div class="flex-none px-16 py-3 bg-primary">
  159.         {# <a class="flex gap-4 my-2 mb-3 text-xl text-black uppercase"
  160.           href="{{ pimcore_url({ object: app.user }) }}">
  161.           {% include 'component/avatar.html.twig' with {
  162.           avatar: app.user.avatar,
  163.           initials: app.user.name|initials,
  164.           size: 'tiny'
  165.         } only %}
  166.           {{ app.user.name }}
  167.         </a> #}
  169.         <ul class="flex justify-center gap-8 mx-auto text-xl text-black">
  170.           <li>
  171.           <a class="grid items-center justify-center gap-2 text-xs justify-items-center"
  172.             href="{{ path('auth_login') }}">
  173.             {% include 'icons/user.svg.twig' with { class: 'h-6 w-6 text-black -mt-1' } %} {{ 'navigation.login'|trans }}
  174.           </a>
  175.         </li>
  176.  <li>
  177.           <a class="grid items-center justify-center gap-2 text-xs justify-items-center{{
  178.             app.request.get('_route') == 'auth_register'
  179.               ? 'font-medium'
  180.               : ''
  181.             }}"
  182.             href="{{ path('auth_register') }}">
  183.             {% include 'icons/arrow-right.svg.twig' with { class: 'h-6 w-6 text-black -mt-1' } %}
  185.             {{ 'navigation.register'|trans }}
  186.           </a>
  187.         </li>
  188.         </ul>
  189.       </div>
  190.     {% endif %}
  191.     <div class="h-16">
  193.     </div>
  194. </div>