@implements IDisposable

@inject NavigationManager NavigationManager

<div class="top-row ps-3 navbar navbar-dark shadow-sm">
    <div class="container-fluid px-0 text-center">
        @if (!showText)
        {
            <a class="navbar-brand text-center" @onclick="() => ToggleCompress()">Wind <i class="fas fa-caret-square-right"></i></a>
        }
        else
        {
            <a class="navbar-brand text-center" @onclick="() => ToggleCompress()">Window <i class="fas fa-caret-square-left"></i></a>
        }
        <button title="Navigation menu" class="navbar-toggler" @onclick="ToggleNavMenu">
            <span class="navbar-toggler-icon"></span>
        </button>
    </div>
</div>

<div class="@NavMenuCssClass" @onclick="ToggleNavMenu">
    <nav class="flex-column">
        <div class="nav-item px-3">
            <NavLink class="nav-link" href="EditJWD" Match="NavLinkMatch.All">
                <span class="fa-solid fa-gear px-2 fs-4" aria-hidden="true"></span>
                @if (showText)
                {
                    <span class="@hideText">EditJWD</span>
                }
            </NavLink>
        </div>
        <div class="nav-item px-3">
            <NavLink class="nav-link" href="BaseEdit">
                <span class="fa-solid fa-pencil px-2 fs-4" aria-hidden="true"></span> <span class="@hideText">BaseEdit</span>
            </NavLink>
        </div>
        <div class="nav-item px-3">
            <NavLink class="nav-link" href="TestError">
                <span class="fa-solid fa-pencil px-2 fs-4" aria-hidden="true"></span> <span class="@hideText">TestError</span>
            </NavLink>
        </div>
@*         <div class="nav-item px-3">
            <NavLink class="nav-link" href="EditJWD">
                <span class="fa-solid fa-gear px-2 fs-4" aria-hidden="true"></span> <span class="@hideText">EditJWD</span>
            </NavLink>
        </div> *@
    </nav>
</div>