feat: Implement sidebar toggle functionality and enhance Monthly Timesheet summary view
This commit is contained in:
parent
cab549ab3a
commit
a7f8dfba01
13 changed files with 686 additions and 58 deletions
|
|
@ -2,59 +2,72 @@
|
|||
@using WorkTracker.Configuration
|
||||
@inject IOptions<AppAuthOptions> AppAuthOptions
|
||||
|
||||
@code {
|
||||
[Parameter] public bool IsCollapsed { get; set; }
|
||||
}
|
||||
|
||||
<div class="nav-menu-shell @(IsCollapsed ? "nav-menu-shell-collapsed" : string.Empty)" data-testid="sidebar-shell" data-collapsed="@(IsCollapsed ? "true" : "false")">
|
||||
<div class="top-row ps-3 navbar navbar-dark">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" href="">WorkTracker</a>
|
||||
<a class="navbar-brand" href="" aria-label="WorkTracker home">
|
||||
<span class="sidebar-brand-full">WorkTracker</span>
|
||||
<span class="sidebar-brand-compact" aria-hidden="true">WT</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<input type="checkbox" title="Navigation menu" class="navbar-toggler" />
|
||||
|
||||
<div class="nav-scrollable" onclick="document.querySelector('.navbar-toggler').click()">
|
||||
<nav class="nav flex-column">
|
||||
<div class="nav-scrollable">
|
||||
<nav id="sidebar-navigation" class="nav flex-column" aria-label="Sidebar navigation">
|
||||
<div class="nav-item px-3">
|
||||
<NavLink class="nav-link" href="" Match="NavLinkMatch.All">
|
||||
<span class="bi bi-house-door-fill-nav-menu" aria-hidden="true"></span> Dashboard
|
||||
<NavLink class="nav-link" href="" Match="NavLinkMatch.All" aria-label="Dashboard" title="Dashboard">
|
||||
<span class="bi bi-house-door-fill-nav-menu" aria-hidden="true"></span>
|
||||
<span class="nav-label">Dashboard</span>
|
||||
</NavLink>
|
||||
</div>
|
||||
|
||||
<div class="nav-item px-3">
|
||||
<NavLink class="nav-link" href="grid">
|
||||
<span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> Grid View
|
||||
<NavLink class="nav-link" href="grid" aria-label="Grid View" title="Grid View">
|
||||
<span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span>
|
||||
<span class="nav-label">Grid View</span>
|
||||
</NavLink>
|
||||
</div>
|
||||
|
||||
<div class="nav-item px-3">
|
||||
<NavLink class="nav-link" href="calendar">
|
||||
<span class="bi bi-calendar3-nav-menu" aria-hidden="true"></span> Calendar
|
||||
<NavLink class="nav-link" href="calendar" aria-label="Calendar" title="Calendar">
|
||||
<span class="bi bi-calendar3-nav-menu" aria-hidden="true"></span>
|
||||
<span class="nav-label">Calendar</span>
|
||||
</NavLink>
|
||||
</div>
|
||||
|
||||
<div class="nav-item px-3">
|
||||
<NavLink class="nav-link" href="summary">
|
||||
<span class="bi bi-bar-chart-fill-nav-menu" aria-hidden="true"></span> Summary
|
||||
<NavLink class="nav-link" href="summary" aria-label="Summary" title="Summary">
|
||||
<span class="bi bi-bar-chart-fill-nav-menu" aria-hidden="true"></span>
|
||||
<span class="nav-label">Summary</span>
|
||||
</NavLink>
|
||||
</div>
|
||||
|
||||
<div class="nav-item px-3">
|
||||
<NavLink class="nav-link" href="settings">
|
||||
<span class="bi bi-gear-fill-nav-menu" aria-hidden="true"></span> Settings
|
||||
<NavLink class="nav-link" href="settings" aria-label="Settings" title="Settings">
|
||||
<span class="bi bi-gear-fill-nav-menu" aria-hidden="true"></span>
|
||||
<span class="nav-label">Settings</span>
|
||||
</NavLink>
|
||||
</div>
|
||||
|
||||
<AuthorizeView>
|
||||
<Authorized>
|
||||
<div class="nav-item px-3">
|
||||
<NavLink class="nav-link" href="auth">
|
||||
<span class="bi bi-person-fill-nav-menu" aria-hidden="true"></span> @context.User.Identity?.Name
|
||||
<NavLink class="nav-link" href="auth" aria-label="@context.User.Identity?.Name" title="@context.User.Identity?.Name">
|
||||
<span class="bi bi-person-fill-nav-menu" aria-hidden="true"></span>
|
||||
<span class="nav-label">@context.User.Identity?.Name</span>
|
||||
</NavLink>
|
||||
</div>
|
||||
@if (AppAuthOptions.Value.Enabled)
|
||||
{
|
||||
<div class="nav-item px-3">
|
||||
<form action="/api/logout" method="post">
|
||||
<button type="submit" class="nav-link">
|
||||
<span class="bi bi-arrow-bar-left-nav-menu" aria-hidden="true"></span> Logout
|
||||
<button type="submit" class="nav-link" aria-label="Logout" title="Logout">
|
||||
<span class="bi bi-arrow-bar-left-nav-menu" aria-hidden="true"></span>
|
||||
<span class="nav-label">Logout</span>
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
|
@ -62,13 +75,15 @@
|
|||
</Authorized>
|
||||
<NotAuthorized>
|
||||
<div class="nav-item px-3">
|
||||
<NavLink class="nav-link" href="login">
|
||||
<span class="bi bi-person-badge-nav-menu" aria-hidden="true"></span> Login
|
||||
<NavLink class="nav-link" href="login" aria-label="Login" title="Login">
|
||||
<span class="bi bi-person-badge-nav-menu" aria-hidden="true"></span>
|
||||
<span class="nav-label">Login</span>
|
||||
</NavLink>
|
||||
</div>
|
||||
</NotAuthorized>
|
||||
</AuthorizeView>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue