y4f/Shared/NavMenu.razor
2023-03-07 11:31:44 +01:00

56 lines
2.7 KiB
Plaintext

<nav class="navbar navbar-expand-md navbar-light mb-4 me-5 ms-5 ">
<div class="container-fluid">
@*<a class="navbar-brand" href="">Yummy4Friends</a>*@
<a class="navbar-brand" href="">
<img src="assets/Logo_new.png" alt="Yummy4Friends" width="100" height="100">
</a>
<button class="navbar-toggler @NavButtonCssClass" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse"
aria-controls="navbarCollapse" aria-label="Toggle navigation" @onclick="ToggleNavMenu">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end @NavBarCssClass" id="navbarCollapse" @onclick="ToggleNavMenu">
<ul class="navbar-nav">
<li class="nav-item">
</li>
<li class="nav-item">
<NavLink class="nav-link" href="allergene">
Allergene
</NavLink>
</li>
<li class="nav-item">
<NavLink class="nav-link" href="counter">
Speisekarte
</NavLink>
</li>
<li class="nav-item">
<NavLink class="nav-link" href="shopping_cart">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-cart3" viewBox="0 0 16 16">
<path d="M0 1.5A.5.5 0 0 1 .5 1H2a.5.5 0 0 1 .485.379L2.89 3H14.5a.5.5 0 0 1 .49.598l-1 5a.5.5 0 0 1-.465.401l-9.397.472L4.415 11H13a.5.5 0 0 1 0 1H4a.5.5 0 0 1-.491-.408L2.01 3.607 1.61 2H.5a.5.5 0 0 1-.5-.5zM3.102 4l.84 4.479 9.144-.459L13.89 4H3.102zM5 12a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm7 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm-7 1a1 1 0 1 1 0 2 1 1 0 0 1 0-2zm7 0a1 1 0 1 1 0 2 1 1 0 0 1 0-2z" />
</svg>
</NavLink>
</li>
<li class="nav-item">
<NavLink class="nav-link" href="profile">
#12345
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" class="bi bi-person-fill" viewBox="0 0 16 16">
<path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" />
</svg>
</NavLink>
</li>
</ul>
</div>
</div>
</nav>
@code {
private bool collapseNavMenu = true;
private string? NavBarCssClass => collapseNavMenu ? null : "show";
private string? NavButtonCssClass => collapseNavMenu ? "collapsed" : null;
private void ToggleNavMenu()
{
collapseNavMenu = !collapseNavMenu;
}
}