<header class="top-header"> <nav class="navbar navbar-expand align-items-center"> <!-- tombol buka/tutup sidebar --> <div class="btn-toggle"> <a href="javascript:;" class="d-inline-flex"> <i class="material-icons-outlined">menu</i> </a> </div> <div> <p class="mb-0 fw-bold">DASHBOARD SGN</p> </div> <!-- kanan: hanya profil --> <div class="ms-auto"> <ul class="navbar-nav align-items-center"> <li class="nav-item dropdown"> <p id="user-name" class="mb-0 font-bold">{{ app.user.name ?? app.user.username }}</p> <a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="javascript:;" data-bs-toggle="dropdown" data-bs-auto-close="outside"> <img src="{{ asset('frontend/img/user.png') }}" class="rounded-circle p-1 border" width="40" height="40" alt=""> </a> <div class="dropdown-menu dropdown-user dropdown-menu-end shadow"> <a href="{{ path('kmj_user_profile') }}" class="dropdown-item d-flex align-items-center gap-2 py-2" href="javascript:;"> <i class="material-icons-outlined">person_outline</i>Profile </a> <a href="{{ path('kmj_user_change_password') }}" class="dropdown-item d-flex align-items-center gap-2 py-2" href="javascript:;"> <i class="material-icons-outlined">settings</i>Setting </a> <hr class="dropdown-divider"> <a href="{{ path('kmj_user_logout') }}" class="dropdown-item d-flex align-items-center gap-2 py-2" href="javascript:;"> <i class="material-icons-outlined">power_settings_new</i>Logout </a> </div> </li> </ul> </div> </nav></header>