udpate main layout

This commit is contained in:
Đăng Nguyễn 2025-09-26 10:55:39 +07:00
parent 7c4404ec3d
commit 4330879411
13 changed files with 64 additions and 52 deletions

View File

@ -1,11 +1,17 @@

.app-shell {
display: flex;
min-height: 100vh;
min-height: 100vh;
min-width: 100vw;
width: 100vw;
height: 100vh;
overflow: hidden;
flex-direction: row;
}
.page {
flex: 1 1 auto;
min-width: 0;
overflow: auto;
flex: 1 1 auto;
min-width: 0;
display: flex;
overflow: hidden;
}

View File

@ -31,6 +31,25 @@
}
</div>
<div class="user">
<div>
<span class="mdi mdi-account mdi-36px text-white "></span>
</div>
<AuthorizeView>
<Authorized>
<div class="nav-label">
<MudText Class="text-white name" Typo="Typo.subtitle1">@context.User.Identity?.Name</MudText>
</div>
</Authorized>
</AuthorizeView>
<MudSpacer />
<form action="Account/Logout" method="post">
<AntiforgeryToken />
<input type="hidden" name="ReturnUrl" value="" />
<button class="btn button">
<i class="mdi mdi-logout" style="color: white; font-size: 35px"></i>
</button>
@* <MudIconButton Class="text-white" ButtonType="@ButtonType.Submit" Icon="@Icons.Material.Filled.Logout" /> *@
</form>
</div>
</div>
@ -45,7 +64,7 @@
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},
new(){Icon = "mdi-map-legend", Path="/Maps-manager", Label = "Mapping", Match = NavLinkMatch.All},
];
private bool collapseNavMenu = true;

View File

@ -48,10 +48,9 @@
display: flex;
}
/*.sidebar .title .button {
display: flex;
border-radius: 20px;
}*/
.sidebar.collapsed .nav-label {
display: none;
}
.sidebar .title .button:hover {
background-color: rgb(5, 39, 80);
@ -67,8 +66,8 @@
display: none !important;
}
.sidebar.collapsed .nav-label {
display: none;
.sidebar.collapsed .user .nav-label {
display: none !important;
}
.nav-item {

View File

@ -1,4 +1,4 @@
@page "/"
@using Microsoft.AspNetCore.Authorization
@attribute [Authorize]
<h1>Welcome to RobotApp!</h1>
<h1>Welcome to RobotApp!</h1>

View File

@ -1,18 +0,0 @@
@using RobotApp.Client.Layout
<CascadingAuthenticationState>
<Router AppAssembly="@typeof(Program).Assembly">
<Found Context="routeData">
<AuthorizeRouteView RouteData="routeData" DefaultLayout="typeof(MainLayout)">
<NotAuthorized>
<RedirectToLogin />
</NotAuthorized>
</AuthorizeRouteView>
</Found>
<NotFound>
<LayoutView Layout="typeof(MainLayout)">
<p>Không tìm thấy trang.</p>
</LayoutView>
</NotFound>
</Router>
</CascadingAuthenticationState>

View File

@ -5,27 +5,41 @@
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<base href="/" />
<link rel="stylesheet" href="_content/MudBlazor/MudBlazor.min.css" />
<link rel="stylesheet" href="@Assets["lib/bootstrap/css/bootstrap.min.css"]" />
<link rel="stylesheet" href="@Assets["lib/mdi/font/css/materialdesignicons.min.css"]" />
<link rel="stylesheet" href="@Assets["lib/bootstrap/dist/css/bootstrap.min.css"]" />
<link rel="stylesheet" href="@Assets["app.css"]" />
<link rel="stylesheet" href="@Assets["RobotApp.styles.css"]" />
<ImportMap />
<link rel="stylesheet" href="@Assets["_content/MudBlazor/MudBlazor.min.css"]" />
<link rel="icon" type="image/png" href="favicon.png" />
<ImportMap />
<ImportMap @rendermode="InteractiveServer" />
<HeadOutlet @rendermode="InteractiveServer" />
</head>
<body>
<Routes />
<CascadingAuthenticationState>
<Router AppAssembly="@typeof(Program).Assembly">
<Found Context="routeData">
<AuthorizeRouteView RouteData="routeData" DefaultLayout="typeof(RobotApp.Client.Layout.MainLayout)">
<NotAuthorized>
<RedirectToLogin />
</NotAuthorized>
</AuthorizeRouteView>
</Found>
<NotFound>
<PageTitle>Not found</PageTitle>
<LayoutView Layout="typeof(RobotApp.Client.Layout.MainLayout)">
<p>Không tìm thấy trang.</p>
</LayoutView>
</NotFound>
</Router>
</CascadingAuthenticationState>
<script src="_framework/blazor.web.js"></script>
<script src="@Assets["lib/bootstrap/js/bootstrap.bundle.min.js"]"></script>
<script src="@Assets["lib/bootstrap/js/bootstrap.min.js"]"></script>
<script src="_content/MudBlazor/MudBlazor.min.js"></script>
</body>
</html>

View File

@ -6,6 +6,7 @@ using RobotApp.Components;
using RobotApp.Components.Account;
using RobotApp.Data;
using RobotApp.Services.Robot;
using RobotApp.Client;
var builder = WebApplication.CreateBuilder(args);

View File

@ -32,7 +32,6 @@
<ItemGroup>
<Folder Include="Services\Robot\Simulation\" />
<Folder Include="wwwroot\lib\" />
</ItemGroup>
</Project>

View File

@ -1,15 +0,0 @@
{
"version": "3.0",
"defaultProvider": "jsdelivr",
"libraries": [
{
"library": "@mdi/font@7.4.47",
"destination": "wwwroot/lib/mdi/font/"
},
{
"provider": "cdnjs",
"library": "bootstrap@5.3.8",
"destination": "wwwroot/lib/bootstrap/"
}
]
}

Binary file not shown.

View File

@ -1,5 +1,7 @@
html, body {
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
width: 100vw;
height: 100vh;
}
a, .btn-link {

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

View File

@ -0,0 +1,5 @@
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
<path d="M31.81,1.79,21.29,14.32l-2.48-3a2.6,2.6,0,0,1,0-3.34l4.45-5.31a2.64,2.64,0,0,1,2-.93Z" fill="#e06e2e"/>
<path d="M.19,1.8,10.71,14.34l2.48-2.95a2.6,2.6,0,0,0,0-3.34L8.75,2.74a2.66,2.66,0,0,0-2-.94Z" fill="#e06e2e"/>
<path d="M32,30.21H25.36a2.61,2.61,0,0,1-2-.92L16.5,21.1a.65.65,0,0,0-1,0L8.63,29.29a2.58,2.58,0,0,1-2,.92H0L12.07,15.83,14,13.57a2.67,2.67,0,0,1,4.08,0l1.89,2.26Z" fill="#233871"/>
</svg>

After

Width:  |  Height:  |  Size: 510 B