60 lines
1.9 KiB
Plaintext
60 lines
1.9 KiB
Plaintext
@using Microsoft.AspNetCore.Components.Routing
|
|
|
|
<script>
|
|
function toggleSidebar() {
|
|
let sidebar = document.querySelector(".sidebar");
|
|
sidebar.classList.toggle("collapsed");
|
|
}
|
|
</script>
|
|
|
|
<div class="sidebar collapsed">
|
|
<div class="flex-grow-1 d-flex flex-column">
|
|
<div class="title">
|
|
<img src="images/logoLight.svg" alt="PhenikaaX" style="height: 35px;" onclick="toggleSidebar()" />
|
|
<button class="btn button" onclick="toggleSidebar()">
|
|
<i class="mdi mdi-menu" style="color: white; font-size: 35px"></i>
|
|
</button>
|
|
</div>
|
|
<hr />
|
|
@foreach (var nav in Navs)
|
|
{
|
|
<div class="nav-item px-3">
|
|
<NavLink class="nav-link" href="@nav.Path" Match="@nav.Match">
|
|
<div class="d-flex align-items-center">
|
|
<div class="nav-icon">
|
|
<span class="mdi @nav.Icon mdi-36px" aria-hidden="true"></span>
|
|
</div>
|
|
<span class="nav-label">@nav.Label</span>
|
|
</div>
|
|
</NavLink>
|
|
</div>
|
|
}
|
|
</div>
|
|
<div class="user">
|
|
</div>
|
|
</div>
|
|
|
|
@code {
|
|
public class NavModel
|
|
{
|
|
public string Icon { get; set; } = "";
|
|
public string Path { get; set; } = "";
|
|
public string Label { get; set; } = "";
|
|
public NavLinkMatch Match { get; set; }
|
|
}
|
|
|
|
public NavModel[] Navs = [
|
|
new(){Icon = "mdi-view-dashboard", Path="/", Label = "Dashboard", Match = NavLinkMatch.All},
|
|
new(){Icon = "mdi-map-legend", Path="/", Label = "Maps-manager", Match = NavLinkMatch.All},
|
|
];
|
|
|
|
private bool collapseNavMenu = true;
|
|
|
|
private string? NavMenuCssClass => collapseNavMenu ? "collapse" : null;
|
|
|
|
private void ToggleNavMenu()
|
|
{
|
|
collapseNavMenu = !collapseNavMenu;
|
|
}
|
|
}
|