Biskilog_Accounting/Client/Elements/Headbar.razor

@using Biskilog_Accounting.Shared.Interfaces;
@inject ISearchService m_searchService
@inject IJSRuntime JSRuntime
@inject ITokenService m_tokenService
@inject NavigationManager m_navigationManager

<!-- Navbar -->
<nav class="layout-navbar container-xxl navbar navbar-expand-xl navbar-detached align-items-center bg-navbar-theme"
     id="layout-navbar">
    <div class="layout-menu-toggle navbar-nav align-items-xl-center me-3 me-xl-0 d-xl-none">
        <a class="nav-item nav-link px-0 me-xl-4" href="javascript:void(0)">
            <i class="bx bx-menu bx-sm"></i>
        </a>
    </div>

    <div class="navbar-nav-right d-flex align-items-center" id="navbar-collapse">
        <!-- Search -->
        <div class="navbar-nav align-items-center" style="width:100%;">
            <div class="nav-item d-flex align-items-center" style="width:100%;">
                <i class="bx bx-search fs-4 lh-0"></i>
                <input type="text"
                       id="mainSearch"
                       class="form-control border-0 shadow-none"
                       placeholder="Search..."
                       aria-label="Search..."
                       @oninput="@(args => SearchInput(args.Value.ToString()))" />
            </div>
            <div id="Profile" @onclick="@ToggleDropdown">
                <i class="bx bxs-user fs-4 lh-0"></i>

                <ul class=@m_dropDownClass style="width: 150px;right: 5px;">
                    <li><a href="#">Profile</a></li>
                    <li><a href="#">Account</a></li>
                    <li><a href="#">Settings</a></li>
                    <li><a id="logOutBtn" href="javascript:void(0)" @onclick=@LogOut>Log Out</a></li>
                </ul>
            </div>
        </div>
    </div>

</nav>

<!-- / Navbar -->