<div id="mobile-bottom-navigation" class="fixed bottom-0 items-center justify-between w-full px-4 text-white border-t-4 shadow-2xl border-primary-500 z-1700 bg-neutral-900 lg:shadow-none lg:hidden"> {# LOGO #} {# <a class="ml-2" href="/{{ app.request.locale }}" title="{{ 'topbar-homepage'|trans }}"> <img class="w-auto h-12" src="{{ pimcore_website_config('logo') }}" alt="logo" /> </a> #} <div class="grid items-center justify-center grid-cols-4 text-white justify-items-center"> {% if app.user %} <a href="{{ path('profile_notifications_index') }}" id="user-topbar-notifications-icon-mobile" class="{{ check_if_unread_notifications(app.user) ? 'has-new' : '' }}"> {% include 'icons/bell.svg.twig' with { class: 'w-5 inline' } %} </a> <a href="{{ path('profile_messages_index') }}" id="user-topbar-messages-icon-mobile" class="{{ check_if_unread_messages(app.user.id) ? 'has-new' : '' }}"> {% include 'icons/chat.svg.twig' with { class: 'w-5 inline' } %} </a> <a href="{{ pimcore_url({ object: app.user }) }}" class=""> {% include 'icons/login.svg.twig' with { class: 'w-6 inline' } %} </a> {% endif %} {# Mobile Menu Button #} <div class="w-16 h-16 col-start-4 pt-1"> <a class="text-white burger" data-action="nav#toggle"> {# <span class="text-white"></span> <span></span> <span></span> #} {% include 'icons/burger.svg.twig' with { class: 'w-6' } %} </a> </div> </div></div>