style: updated main layout (no mobile support yet)
This commit is contained in:
parent
45fca3253b
commit
ae0f9c6796
GPG key ID:
4B6F6A83178F595E
|
|
@ -1,17 +1,16 @@
|
||||||
@inherits LayoutComponentBase
|
@inherits LayoutComponentBase
|
||||||
|
|
||||||
<div class="page">
|
<div class="flex flex-col h-screen">
|
||||||
<div class="sidebar">
|
<NavMenu />
|
||||||
<NavMenu />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<main>
|
<main class="flex-1 container mx-auto px-12 py-8">
|
||||||
<div class="top-row px-4">
|
@Body
|
||||||
<a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
|
</main>
|
||||||
</div>
|
|
||||||
|
<footer class="footer footer-center p-4 bg-base-300 text-base-content">
|
||||||
<article class="content px-4">
|
<span class="block">
|
||||||
@Body
|
Powered by
|
||||||
</article>
|
<a class="link link-primary" target="_blank" href="https://github.com/miawinter98/Wave">Wave</a>
|
||||||
</main>
|
</span>
|
||||||
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -2,85 +2,69 @@
|
||||||
|
|
||||||
@inject NavigationManager NavigationManager
|
@inject NavigationManager NavigationManager
|
||||||
|
|
||||||
<div class="top-row ps-3 navbar navbar-dark">
|
<header>
|
||||||
<div class="container-fluid">
|
<div class="navbar bg-base-200">
|
||||||
<a class="navbar-brand" href="">Wave</a>
|
<div class="navbar-start">
|
||||||
</div>
|
<picture class="h-12">
|
||||||
</div>
|
<source type="image/jxl" srcset="img/logo.jxl" />
|
||||||
|
<source type="image/webp" srcset="img/logo.webp" />
|
||||||
<input type="checkbox" title="Navigation menu" class="navbar-toggler" />
|
<source type="image/svg+xml" scrset="img/logo.svg" />
|
||||||
|
<img class="max-h-full object-contain object-left" src="img/logo.png" alt="Wave" />
|
||||||
<div class="nav-scrollable" onclick="document.querySelector('.navbar-toggler').click()">
|
</picture>
|
||||||
<nav class="flex-column">
|
</div>
|
||||||
<div class="nav-item px-3">
|
<div class="navbar-center"></div>
|
||||||
<NavLink class="nav-link" href="" Match="NavLinkMatch.All">
|
<div class="navbar-end">
|
||||||
<span class="bi bi-house-door-fill-nav-menu" aria-hidden="true"></span> Home
|
<ul class="menu menu-horizontal">
|
||||||
</NavLink>
|
<AuthorizeView>
|
||||||
</div>
|
<Authorized>
|
||||||
|
<li>
|
||||||
<div class="nav-item px-3">
|
<NavLink ActiveClass="tab-active" class="tab" href="Account/Manage">@context.User.Identity?.Name</NavLink>
|
||||||
<NavLink class="nav-link" href="weather">
|
</li>
|
||||||
<span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> Weather
|
<li>
|
||||||
</NavLink>
|
<form action="Account/Logout" method="post">
|
||||||
</div>
|
<AntiforgeryToken />
|
||||||
|
<input type="hidden" name="ReturnUrl" value="@_currentUrl" />
|
||||||
<div class="nav-item px-3">
|
<button type="submit" class="">Logout</button>
|
||||||
<NavLink class="nav-link" href="auth">
|
</form>
|
||||||
<span class="bi bi-lock-nav-menu" aria-hidden="true"></span> Auth Required
|
</li>
|
||||||
</NavLink>
|
</Authorized>
|
||||||
</div>
|
<NotAuthorized>
|
||||||
|
<li>
|
||||||
<AuthorizeView>
|
<NavLink href="Account/Login">Login</NavLink>
|
||||||
<Authorized>
|
</li>
|
||||||
<div class="nav-item px-3">
|
<li>
|
||||||
<NavLink class="nav-link" href="Account/Manage">
|
<NavLink href="Account/Register">Register</NavLink>
|
||||||
<span class="bi bi-person-fill-nav-menu" aria-hidden="true"></span> @context.User.Identity?.Name
|
</li>
|
||||||
</NavLink>
|
</NotAuthorized>
|
||||||
</div>
|
</AuthorizeView>
|
||||||
<div class="nav-item px-3">
|
</ul>
|
||||||
<form action="Account/Logout" method="post">
|
</div>
|
||||||
<AntiforgeryToken />
|
</div>
|
||||||
<input type="hidden" name="ReturnUrl" value="@currentUrl" />
|
<div class="flex justify-center bg-base-300">
|
||||||
<button type="submit" class="nav-link">
|
<nav class="tabs tabs-bordered">
|
||||||
<span class="bi bi-arrow-bar-left-nav-menu" aria-hidden="true"></span> Logout
|
<NavLink ActiveClass="tab-active" class="tab" href="" Match="NavLinkMatch.All">Home</NavLink>
|
||||||
</button>
|
<NavLink ActiveClass="tab-active" class="tab" href="weather">Weather</NavLink>
|
||||||
</form>
|
<NavLink ActiveClass="tab-active" class="tab" href="auth">Auth Required</NavLink>
|
||||||
</div>
|
</nav>
|
||||||
</Authorized>
|
</div>
|
||||||
<NotAuthorized>
|
</header>
|
||||||
<div class="nav-item px-3">
|
|
||||||
<NavLink class="nav-link" href="Account/Register">
|
|
||||||
<span class="bi bi-person-nav-menu" aria-hidden="true"></span> Register
|
|
||||||
</NavLink>
|
|
||||||
</div>
|
|
||||||
<div class="nav-item px-3">
|
|
||||||
<NavLink class="nav-link" href="Account/Login">
|
|
||||||
<span class="bi bi-person-badge-nav-menu" aria-hidden="true"></span> Login
|
|
||||||
</NavLink>
|
|
||||||
</div>
|
|
||||||
</NotAuthorized>
|
|
||||||
</AuthorizeView>
|
|
||||||
</nav>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
@code {
|
@code {
|
||||||
private string? currentUrl;
|
private string? _currentUrl;
|
||||||
|
|
||||||
protected override void OnInitialized()
|
protected override void OnInitialized() {
|
||||||
{
|
_currentUrl = NavigationManager.ToBaseRelativePath(NavigationManager.Uri);
|
||||||
currentUrl = NavigationManager.ToBaseRelativePath(NavigationManager.Uri);
|
NavigationManager.LocationChanged += OnLocationChanged;
|
||||||
NavigationManager.LocationChanged += OnLocationChanged;
|
}
|
||||||
}
|
|
||||||
|
|
||||||
private void OnLocationChanged(object? sender, LocationChangedEventArgs e)
|
private void OnLocationChanged(object? sender, LocationChangedEventArgs e) {
|
||||||
{
|
_currentUrl = NavigationManager.ToBaseRelativePath(e.Location);
|
||||||
currentUrl = NavigationManager.ToBaseRelativePath(e.Location);
|
StateHasChanged();
|
||||||
StateHasChanged();
|
}
|
||||||
}
|
|
||||||
|
public void Dispose() {
|
||||||
|
NavigationManager.LocationChanged -= OnLocationChanged;
|
||||||
|
}
|
||||||
|
|
||||||
public void Dispose()
|
|
||||||
{
|
|
||||||
NavigationManager.LocationChanged -= OnLocationChanged;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -16,4 +16,8 @@
|
||||||
<PackageReference Include="Microsoft.VisualStudio.Azure.Containers.Tools.Targets" Version="1.19.6" />
|
<PackageReference Include="Microsoft.VisualStudio.Azure.Containers.Tools.Targets" Version="1.19.6" />
|
||||||
</ItemGroup>
|
</ItemGroup>
|
||||||
|
|
||||||
|
<ItemGroup>
|
||||||
|
<Folder Include="wwwroot\img\" />
|
||||||
|
</ItemGroup>
|
||||||
|
|
||||||
</Project>
|
</Project>
|
||||||
|
|
|
||||||
2
Wave/wwwroot/css/main.min.css
vendored
2
Wave/wwwroot/css/main.min.css
vendored
File diff suppressed because one or more lines are too long
BIN
Wave/wwwroot/img/logo.jxl
Normal file
BIN
Wave/wwwroot/img/logo.jxl
Normal file
Binary file not shown.
BIN
Wave/wwwroot/img/logo.png
Normal file
BIN
Wave/wwwroot/img/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
31
Wave/wwwroot/img/logo.svg
Normal file
31
Wave/wwwroot/img/logo.svg
Normal file
|
|
@ -0,0 +1,31 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<svg width="100%" height="100%" viewBox="0 0 1000 400" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
|
||||||
|
<g id="Icon">
|
||||||
|
<rect x="39.887" y="40" width="320.113" height="320" style="fill:#fff132;"/>
|
||||||
|
<rect x="40" y="40" width="320.113" height="320" style="fill:none;"/>
|
||||||
|
<clipPath id="_clip1">
|
||||||
|
<rect x="40" y="40" width="320.113" height="320"/>
|
||||||
|
</clipPath>
|
||||||
|
<g clip-path="url(#_clip1)">
|
||||||
|
<path d="M360.113,360L40.113,360L40.113,239.079C40.113,239.079 73.055,257.202 102.556,232.914C129.983,279.98 302.014,274.502 360.113,275.084L360.113,360Z" style="fill:#d4f5ff;"/>
|
||||||
|
<path d="M168.807,349.41C102.256,337.863 51.582,279.774 51.582,209.943C51.582,131.817 115.01,68.389 193.136,68.389C261.346,68.389 318.352,116.738 331.724,181.006C311.113,163.066 284.188,152.199 254.745,152.199C189.981,152.199 137.401,204.779 137.401,269.542C137.401,300.381 149.324,328.458 168.807,349.41Z" style="fill:#75deff;"/>
|
||||||
|
<clipPath id="_clip2">
|
||||||
|
<path d="M168.807,349.41C102.256,337.863 51.582,279.774 51.582,209.943C51.582,131.817 115.01,68.389 193.136,68.389C261.346,68.389 318.352,116.738 331.724,181.006C311.113,163.066 284.188,152.199 254.745,152.199C189.981,152.199 137.401,204.779 137.401,269.542C137.401,300.381 149.324,328.458 168.807,349.41Z"/>
|
||||||
|
</clipPath>
|
||||||
|
<g clip-path="url(#_clip2)">
|
||||||
|
<path d="M203.197,416.753C136.647,405.205 85.972,347.117 85.972,277.285C85.972,199.16 149.4,135.731 227.526,135.731C295.736,135.731 352.743,184.081 366.114,248.348C345.503,230.409 318.578,219.541 289.135,219.541C224.371,219.541 171.792,272.121 171.792,336.885C171.792,367.724 183.714,395.801 203.197,416.753Z" style="fill:#d4f5ff;"/>
|
||||||
|
<path d="M150.362,301.351C83.811,289.803 33.137,231.714 33.137,161.883C33.137,83.757 96.565,20.329 174.691,20.329C242.901,20.329 299.907,68.679 313.279,132.946C292.668,115.007 265.743,104.139 236.3,104.139C171.536,104.139 118.956,156.719 118.956,221.482C118.956,252.322 130.879,280.398 150.362,301.351Z" style="fill:#00bdf8;"/>
|
||||||
|
</g>
|
||||||
|
<path d="M360.113,391.226L40.113,391.226L40.113,270.305C40.113,270.305 86.866,257.202 116.367,232.914C143.793,279.98 302.014,293.452 360.113,294.034L360.113,391.226Z" style="fill:#75deff;"/>
|
||||||
|
<path d="M360.113,430.613L40.113,430.613L40,228.822C40,228.822 88.912,253.11 118.413,228.822C122.708,252.422 128.813,264.451 154.793,278.798C213.771,311.366 319.781,311.666 360.113,312.07L360.113,430.613Z" style="fill:#00bdf8;"/>
|
||||||
|
</g>
|
||||||
|
<path d="M360.113,40L360.113,360L40,360L40,40L360.113,40ZM340.509,59.604L59.717,59.604L59.717,340.396L340.509,340.396L340.509,59.604Z" style="fill:#fa769d;"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<path d="M481.055,302.509L396.856,108.35L424.662,108.35L495.927,277.998L489.868,277.998L543.196,108.35L572.865,108.35L625.642,278.274L620.409,278.274L691.785,108.35L718.654,108.35L634.455,302.509L612.698,302.509L556.24,138.369L559.545,138.369L502.261,302.509L481.055,302.509Z" style="fill:#fff132;fill-rule:nonzero;"/>
|
||||||
|
<path d="M643.287,302.509L702.626,167.562L716.982,167.562L776.32,302.509L759.284,302.509L742.823,264.035L750.862,268.82L668.554,268.82L676.593,264.035L660.131,302.509L643.287,302.509ZM709.516,186.512L678.89,258.484L674.296,254.847L745.12,254.847L740.526,258.484L710.091,186.512L709.516,186.512Z" style="fill:#00bdf8;fill-rule:nonzero;"/>
|
||||||
|
<path d="M786.631,302.509L728.058,167.562L745.668,167.562L796.202,286.239L792.374,286.239L842.716,167.562L859.943,167.562L801.37,302.509L786.631,302.509Z" style="fill:#fa769d;fill-rule:nonzero;"/>
|
||||||
|
<path d="M863.006,302.509L863.006,167.562L949.717,167.562L949.717,181.535L879.276,181.535L879.276,227.092L945.697,227.092L945.697,241.065L879.276,241.065L879.276,288.536L949.717,288.536L949.717,302.509L863.006,302.509Z" style="fill:#75deff;fill-rule:nonzero;"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 4.2 KiB |
BIN
Wave/wwwroot/img/logo.webp
Normal file
BIN
Wave/wwwroot/img/logo.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Loading…
Reference in a new issue