MangoWeb/SharedUI/Shared/Components/Layout/NavbarComponent.razor

121 lines
5.1 KiB
Plaintext

@using BlazorWASM.Shared
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark poppins">
<div class="container-fluid">
<a class="navbar-brand" href="/home">MangoWeb</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
@* <div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav me-auto mb-2 mb-md-0">
<li>
<NavLink class="nav-link active" aria-current="page" href="/home">Home</NavLink>
</li>
<li>
<NavLink class="nav-link" href="/portfolio">Portfolio</NavLink>
</li>
<li class="nav-item dropdown dmenu">
<NavLink class="nav-link dropdown-toggle" href="/services" id="navbardrop" data-toggle="dropdown">
Services
</NavLink>
<ul class="dropdown-menu sm-menu">
<li>
<NavLink class="dropdown-item" href="#">Weboldal/Applikáció fejlesztés</NavLink>
</li>
<li>
<NavLink class="dropdown-item" href="#">Landing page</NavLink>
</li>
<li>
<NavLink class="dropdown-item" href="#">Webdesign</NavLink>
</li>
<li>
<NavLink class="dropdown-item" href="#">Arculattervezés</NavLink>
</li>
<li>
<a class="dropdown-item" href="#">Grafikai munkák</a>
</li>
<li>
<NavLink class="dropdown-item" href="#">3D web elemek</NavLink>
</li>
<li>
<NavLink class="dropdown-item" href="#">AI Chatbotok</NavLink>
</li>
<li>
<NavLink class="dropdown-item" href="#">Egyedi szoftverfejlesztés</NavLink>
</li>
</ul>
</li>
<li>
<NavLink class="nav-link" href="/contact" tabindex="-1" aria-disabled="true">Contact</NavLink>
</li>
<li>
<NavLink class="nav-link" href="/otherpages" tabindex="-1" aria-disabled="true">Other pages</NavLink>
</li>
</ul>
<form class="d-flex">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</div> *@
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav me-auto mb-2 mb-md-0">
@{
foreach (NavMenuItem _menuItem in MenuItems)
{
if(_menuItem.SubItems == null)
{
<li>
<NavLink class="nav-link" ActiveClass="active" href="@_menuItem.NavUrl">
@_menuItem.DisplayName
</NavLink>
</li>
}
else
{
<li class="nav-item dropdown dmenu">
<NavLink class="nav-link dropdown-toggle" ActiveClass="active" href="@_menuItem.NavUrl" id="navbardrop" data-toggle="dropdown">
@_menuItem.DisplayName
</NavLink>
<ul class="dropdown-menu sm-menu">
@foreach(NavMenuItem _subMenu in _menuItem.SubItems)
{
<li>
<NavLink class="dropdown-item" href="@_subMenu.NavUrl">@_subMenu.DisplayName</NavLink>
</li>
}
</ul>
</li>
}
}
}
</ul>
<form class="d-flex">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</div>
</div>
</nav>
@code {
[Parameter]
public List<NavMenuItem>? MenuItems { get; set; }
}