From 3c2f374219c732bfa4e7fb0002afd40de635340b Mon Sep 17 00:00:00 2001 From: yash1 Date: Sun, 18 Feb 2024 19:15:21 +0300 Subject: [PATCH 1/3] =?UTF-8?q?=D0=B1=D0=BB=D0=B0=D0=B7=D0=B5=D1=80=20?= =?UTF-8?q?=D0=B2=D0=B0=D0=B1=D0=B0=D0=BF=20=D1=80=D0=B5=D0=B2=D0=BE=D1=80?= =?UTF-8?q?=D0=B3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- VSOP.Application/VSOP.Application.csproj | 1 + VSOP.Persistence/DependencyInjection.cs | 2 + .../Layout/MainLayout.razor | 5 +- .../Layout/NavMenu.razor | 6 +- .../Pages/Home.razor | 5 +- .../Pages/Weather.razor | 18 +-- VSOP.WebApp/VSOP.WebApp.Client/Routes.razor | 8 ++ .../VSOP.WebApp.Client.csproj | 4 + VSOP.WebApp/VSOP.WebApp/Components/App.razor | 4 +- .../Components/Layout/MainLayout.razor.css | 96 ---------------- .../Components/Layout/NavMenu.razor.css | 105 ------------------ .../VSOP.WebApp/Components/Routes.razor | 6 - VSOP.WebApp/VSOP.WebApp/appsettings.json | 3 +- 13 files changed, 37 insertions(+), 226 deletions(-) rename VSOP.WebApp/{VSOP.WebApp/Components => VSOP.WebApp.Client}/Layout/MainLayout.razor (88%) rename VSOP.WebApp/{VSOP.WebApp/Components => VSOP.WebApp.Client}/Layout/NavMenu.razor (89%) rename VSOP.WebApp/{VSOP.WebApp/Components => VSOP.WebApp.Client}/Pages/Home.razor (51%) rename VSOP.WebApp/{VSOP.WebApp/Components => VSOP.WebApp.Client}/Pages/Weather.razor (81%) create mode 100644 VSOP.WebApp/VSOP.WebApp.Client/Routes.razor delete mode 100644 VSOP.WebApp/VSOP.WebApp/Components/Layout/MainLayout.razor.css delete mode 100644 VSOP.WebApp/VSOP.WebApp/Components/Layout/NavMenu.razor.css delete mode 100644 VSOP.WebApp/VSOP.WebApp/Components/Routes.razor diff --git a/VSOP.Application/VSOP.Application.csproj b/VSOP.Application/VSOP.Application.csproj index 178ffb5..e3f3df8 100644 --- a/VSOP.Application/VSOP.Application.csproj +++ b/VSOP.Application/VSOP.Application.csproj @@ -16,6 +16,7 @@ + diff --git a/VSOP.Persistence/DependencyInjection.cs b/VSOP.Persistence/DependencyInjection.cs index 2c0d726..45d396f 100644 --- a/VSOP.Persistence/DependencyInjection.cs +++ b/VSOP.Persistence/DependencyInjection.cs @@ -34,6 +34,8 @@ public static IServiceCollection AddPersistence( services.AddScoped(); services.AddScoped(); services.AddScoped(); + services.AddScoped(); + services.AddScoped(); #endregion services.AddScoped(); diff --git a/VSOP.WebApp/VSOP.WebApp/Components/Layout/MainLayout.razor b/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor similarity index 88% rename from VSOP.WebApp/VSOP.WebApp/Components/Layout/MainLayout.razor rename to VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor index 5a24bb1..09ac68a 100644 --- a/VSOP.WebApp/VSOP.WebApp/Components/Layout/MainLayout.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor @@ -1,4 +1,5 @@ -@inherits LayoutComponentBase +

MainLayout

+@inherits LayoutComponentBase
@@ -20,4 +21,4 @@ An unhandled error has occurred. Reload 🗙 -
+
\ No newline at end of file diff --git a/VSOP.WebApp/VSOP.WebApp/Components/Layout/NavMenu.razor b/VSOP.WebApp/VSOP.WebApp.Client/Layout/NavMenu.razor similarity index 89% rename from VSOP.WebApp/VSOP.WebApp/Components/Layout/NavMenu.razor rename to VSOP.WebApp/VSOP.WebApp.Client/Layout/NavMenu.razor index 233c275..0353827 100644 --- a/VSOP.WebApp/VSOP.WebApp/Components/Layout/NavMenu.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/Layout/NavMenu.razor @@ -1,6 +1,7 @@ -
+

NavMenu

+
- VSOP.WebApp + VSEOP
@@ -27,4 +28,3 @@
- diff --git a/VSOP.WebApp/VSOP.WebApp/Components/Pages/Home.razor b/VSOP.WebApp/VSOP.WebApp.Client/Pages/Home.razor similarity index 51% rename from VSOP.WebApp/VSOP.WebApp/Components/Pages/Home.razor rename to VSOP.WebApp/VSOP.WebApp.Client/Pages/Home.razor index 9001e0b..0a5e464 100644 --- a/VSOP.WebApp/VSOP.WebApp/Components/Pages/Home.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/Pages/Home.razor @@ -1,7 +1,8 @@ -@page "/" +

Home

+@page "/" Home

Hello, world!

-Welcome to your new app. +Welcome to your new app. \ No newline at end of file diff --git a/VSOP.WebApp/VSOP.WebApp/Components/Pages/Weather.razor b/VSOP.WebApp/VSOP.WebApp.Client/Pages/Weather.razor similarity index 81% rename from VSOP.WebApp/VSOP.WebApp/Components/Pages/Weather.razor rename to VSOP.WebApp/VSOP.WebApp.Client/Pages/Weather.razor index 43a1ecb..43c9f3d 100644 --- a/VSOP.WebApp/VSOP.WebApp/Components/Pages/Weather.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/Pages/Weather.razor @@ -1,5 +1,5 @@ -@page "/weather" -@attribute [StreamRendering] +

Weather

+@page "/weather" Weather @@ -41,17 +41,17 @@ else protected override async Task OnInitializedAsync() { - // Simulate asynchronous loading to demonstrate streaming rendering + // Simulate asynchronous loading to demonstrate a loading indicator await Task.Delay(500); var startDate = DateOnly.FromDateTime(DateTime.Now); var summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" }; forecasts = Enumerable.Range(1, 5).Select(index => new WeatherForecast - { - Date = startDate.AddDays(index), - TemperatureC = Random.Shared.Next(-20, 55), - Summary = summaries[Random.Shared.Next(summaries.Length)] - }).ToArray(); + { + Date = startDate.AddDays(index), + TemperatureC = Random.Shared.Next(-20, 55), + Summary = summaries[Random.Shared.Next(summaries.Length)] + }).ToArray(); } private class WeatherForecast @@ -61,4 +61,4 @@ else public string? Summary { get; set; } public int TemperatureF => 32 + (int)(TemperatureC / 0.5556); } -} +} \ No newline at end of file diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Routes.razor b/VSOP.WebApp/VSOP.WebApp.Client/Routes.razor new file mode 100644 index 0000000..33ece2b --- /dev/null +++ b/VSOP.WebApp/VSOP.WebApp.Client/Routes.razor @@ -0,0 +1,8 @@ +

Component

+ + + + + + + diff --git a/VSOP.WebApp/VSOP.WebApp.Client/VSOP.WebApp.Client.csproj b/VSOP.WebApp/VSOP.WebApp.Client/VSOP.WebApp.Client.csproj index 8fd8f57..26fbecd 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/VSOP.WebApp.Client.csproj +++ b/VSOP.WebApp/VSOP.WebApp.Client/VSOP.WebApp.Client.csproj @@ -12,4 +12,8 @@ + + + + diff --git a/VSOP.WebApp/VSOP.WebApp/Components/App.razor b/VSOP.WebApp/VSOP.WebApp/Components/App.razor index 38ccd06..ba2921c 100644 --- a/VSOP.WebApp/VSOP.WebApp/Components/App.razor +++ b/VSOP.WebApp/VSOP.WebApp/Components/App.razor @@ -9,11 +9,11 @@ - + - + diff --git a/VSOP.WebApp/VSOP.WebApp/Components/Layout/MainLayout.razor.css b/VSOP.WebApp/VSOP.WebApp/Components/Layout/MainLayout.razor.css deleted file mode 100644 index 038baf1..0000000 --- a/VSOP.WebApp/VSOP.WebApp/Components/Layout/MainLayout.razor.css +++ /dev/null @@ -1,96 +0,0 @@ -.page { - position: relative; - display: flex; - flex-direction: column; -} - -main { - flex: 1; -} - -.sidebar { - background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%); -} - -.top-row { - background-color: #f7f7f7; - border-bottom: 1px solid #d6d5d5; - justify-content: flex-end; - height: 3.5rem; - display: flex; - align-items: center; -} - - .top-row ::deep a, .top-row ::deep .btn-link { - white-space: nowrap; - margin-left: 1.5rem; - text-decoration: none; - } - - .top-row ::deep a:hover, .top-row ::deep .btn-link:hover { - text-decoration: underline; - } - - .top-row ::deep a:first-child { - overflow: hidden; - text-overflow: ellipsis; - } - -@media (max-width: 640.98px) { - .top-row { - justify-content: space-between; - } - - .top-row ::deep a, .top-row ::deep .btn-link { - margin-left: 0; - } -} - -@media (min-width: 641px) { - .page { - flex-direction: row; - } - - .sidebar { - width: 250px; - height: 100vh; - position: sticky; - top: 0; - } - - .top-row { - position: sticky; - top: 0; - z-index: 1; - } - - .top-row.auth ::deep a:first-child { - flex: 1; - text-align: right; - width: 0; - } - - .top-row, article { - padding-left: 2rem !important; - padding-right: 1.5rem !important; - } -} - -#blazor-error-ui { - background: lightyellow; - bottom: 0; - box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2); - display: none; - left: 0; - padding: 0.6rem 1.25rem 0.7rem 1.25rem; - position: fixed; - width: 100%; - z-index: 1000; -} - - #blazor-error-ui .dismiss { - cursor: pointer; - position: absolute; - right: 0.75rem; - top: 0.5rem; - } diff --git a/VSOP.WebApp/VSOP.WebApp/Components/Layout/NavMenu.razor.css b/VSOP.WebApp/VSOP.WebApp/Components/Layout/NavMenu.razor.css deleted file mode 100644 index 4e15395..0000000 --- a/VSOP.WebApp/VSOP.WebApp/Components/Layout/NavMenu.razor.css +++ /dev/null @@ -1,105 +0,0 @@ -.navbar-toggler { - appearance: none; - cursor: pointer; - width: 3.5rem; - height: 2.5rem; - color: white; - position: absolute; - top: 0.5rem; - right: 1rem; - border: 1px solid rgba(255, 255, 255, 0.1); - background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1); -} - -.navbar-toggler:checked { - background-color: rgba(255, 255, 255, 0.5); -} - -.top-row { - height: 3.5rem; - background-color: rgba(0,0,0,0.4); -} - -.navbar-brand { - font-size: 1.1rem; -} - -.bi { - display: inline-block; - position: relative; - width: 1.25rem; - height: 1.25rem; - margin-right: 0.75rem; - top: -1px; - background-size: cover; -} - -.bi-house-door-fill-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E"); -} - -.bi-plus-square-fill-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E"); -} - -.bi-list-nested-nav-menu { - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E"); -} - -.nav-item { - font-size: 0.9rem; - padding-bottom: 0.5rem; -} - - .nav-item:first-of-type { - padding-top: 1rem; - } - - .nav-item:last-of-type { - padding-bottom: 1rem; - } - - .nav-item ::deep .nav-link { - color: #d7d7d7; - background: none; - border: none; - border-radius: 4px; - height: 3rem; - display: flex; - align-items: center; - line-height: 3rem; - width: 100%; - } - -.nav-item ::deep a.active { - background-color: rgba(255,255,255,0.37); - color: white; -} - -.nav-item ::deep .nav-link:hover { - background-color: rgba(255,255,255,0.1); - color: white; -} - -.nav-scrollable { - display: none; -} - -.navbar-toggler:checked ~ .nav-scrollable { - display: block; -} - -@media (min-width: 641px) { - .navbar-toggler { - display: none; - } - - .nav-scrollable { - /* Never collapse the sidebar for wide screens */ - display: block; - - /* Allow sidebar to scroll for tall menus */ - height: calc(100vh - 3.5rem); - overflow-y: auto; - } -} diff --git a/VSOP.WebApp/VSOP.WebApp/Components/Routes.razor b/VSOP.WebApp/VSOP.WebApp/Components/Routes.razor deleted file mode 100644 index d39c7e8..0000000 --- a/VSOP.WebApp/VSOP.WebApp/Components/Routes.razor +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - diff --git a/VSOP.WebApp/VSOP.WebApp/appsettings.json b/VSOP.WebApp/VSOP.WebApp/appsettings.json index fec464a..aa452f1 100644 --- a/VSOP.WebApp/VSOP.WebApp/appsettings.json +++ b/VSOP.WebApp/VSOP.WebApp/appsettings.json @@ -1,6 +1,7 @@ { "ConnectionStrings": { - "DefaultConnection": "Server=NCQUSHKAPC; Database=test_economicdb; Trusted_Connection=True; TrustServerCertificate=True" + // "DefaultConnection": "Server=NCQUSHKAPC; Database=test_economicdb; Trusted_Connection=True; TrustServerCertificate=True" + "DefaultConnection": "Server=(localdb)\\mssqllocaldb;Database=VSEOP_Proj;Trusted_Connection=True;MultipleActiveResultSets=true" }, "Logging": { From 6d3d52f939979e1656ae3dfe8b212adecba6c4cf Mon Sep 17 00:00:00 2001 From: yash1 Date: Sun, 18 Feb 2024 19:53:46 +0300 Subject: [PATCH 2/3] Radzen update --- .../VSOP.WebApp.Client/Layout/MainLayout.razor | 2 +- VSOP.WebApp/VSOP.WebApp.Client/Program.cs | 6 ++++++ VSOP.WebApp/VSOP.WebApp.Client/Routes.razor | 15 +++++++-------- .../VSOP.WebApp.Client/VSOP.WebApp.Client.csproj | 1 + VSOP.WebApp/VSOP.WebApp.Client/_Imports.razor | 2 ++ VSOP.WebApp/VSOP.WebApp/Components/App.razor | 2 ++ 6 files changed, 19 insertions(+), 9 deletions(-) diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor b/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor index 09ac68a..76de588 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor @@ -1,6 +1,6 @@ 

MainLayout

@inherits LayoutComponentBase - +
diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Program.cs b/VSOP.WebApp/VSOP.WebApp.Client/Program.cs index c0be266..4a43bc2 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/Program.cs +++ b/VSOP.WebApp/VSOP.WebApp.Client/Program.cs @@ -1,4 +1,5 @@ using Microsoft.AspNetCore.Components.WebAssembly.Hosting; +using Radzen; namespace VSOP.WebApp.Client { @@ -6,8 +7,13 @@ internal class Program { static async Task Main(string[] args) { + var builder = WebAssemblyHostBuilder.CreateDefault(args); + builder.Services.AddTransient(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) }); + + builder.Services.AddRadzenComponents(); + await builder.Build().RunAsync(); } } diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Routes.razor b/VSOP.WebApp/VSOP.WebApp.Client/Routes.razor index 33ece2b..4a2e38e 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/Routes.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/Routes.razor @@ -1,8 +1,7 @@ -

Component

- - - - - - - + + + + + + + diff --git a/VSOP.WebApp/VSOP.WebApp.Client/VSOP.WebApp.Client.csproj b/VSOP.WebApp/VSOP.WebApp.Client/VSOP.WebApp.Client.csproj index 26fbecd..b7d54c0 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/VSOP.WebApp.Client.csproj +++ b/VSOP.WebApp/VSOP.WebApp.Client/VSOP.WebApp.Client.csproj @@ -10,6 +10,7 @@ + diff --git a/VSOP.WebApp/VSOP.WebApp.Client/_Imports.razor b/VSOP.WebApp/VSOP.WebApp.Client/_Imports.razor index b3ef6bc..d1108da 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/_Imports.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/_Imports.razor @@ -7,3 +7,5 @@ @using Microsoft.AspNetCore.Components.Web.Virtualization @using Microsoft.JSInterop @using VSOP.WebApp.Client +@using Radzen +@using Radzen.Blazor diff --git a/VSOP.WebApp/VSOP.WebApp/Components/App.razor b/VSOP.WebApp/VSOP.WebApp/Components/App.razor index ba2921c..c928c2a 100644 --- a/VSOP.WebApp/VSOP.WebApp/Components/App.razor +++ b/VSOP.WebApp/VSOP.WebApp/Components/App.razor @@ -8,6 +8,7 @@ + @@ -15,6 +16,7 @@ + From cc90bc2a9c54e1893b3211d82281f91d5c6bf6fe Mon Sep 17 00:00:00 2001 From: Dmitry Egorov Date: Sun, 18 Feb 2024 21:15:50 +0300 Subject: [PATCH 3/3] Blazor switched to InteractiveMode and Radzen.Blazor Added --- .../Layout/MainLayout.razor | 6 +- .../Layout/MainLayout.razor.css | 96 ++++++++++++++++ .../VSOP.WebApp.Client/Layout/NavMenu.razor | 6 +- .../Layout/NavMenu.razor.css | 105 ++++++++++++++++++ .../VSOP.WebApp.Client/Pages/Counter.razor | 1 - .../VSOP.WebApp.Client/Pages/Home.razor | 5 +- .../VSOP.WebApp.Client/Pages/Weather.razor | 15 ++- VSOP.WebApp/VSOP.WebApp.Client/Program.cs | 1 - VSOP.WebApp/VSOP.WebApp.Client/Routes.razor | 3 +- .../VSOP.WebApp.Client.csproj | 6 +- VSOP.WebApp/VSOP.WebApp/Components/App.razor | 4 +- VSOP.WebApp/VSOP.WebApp/Program.cs | 3 + 12 files changed, 223 insertions(+), 28 deletions(-) create mode 100644 VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor.css create mode 100644 VSOP.WebApp/VSOP.WebApp.Client/Layout/NavMenu.razor.css diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor b/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor index 76de588..d74cdf7 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor @@ -1,5 +1,5 @@ -

MainLayout

-@inherits LayoutComponentBase +@inherits LayoutComponentBase +
@@ -21,4 +21,4 @@ An unhandled error has occurred. Reload 🗙 -
\ No newline at end of file +
diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor.css b/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor.css new file mode 100644 index 0000000..038baf1 --- /dev/null +++ b/VSOP.WebApp/VSOP.WebApp.Client/Layout/MainLayout.razor.css @@ -0,0 +1,96 @@ +.page { + position: relative; + display: flex; + flex-direction: column; +} + +main { + flex: 1; +} + +.sidebar { + background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%); +} + +.top-row { + background-color: #f7f7f7; + border-bottom: 1px solid #d6d5d5; + justify-content: flex-end; + height: 3.5rem; + display: flex; + align-items: center; +} + + .top-row ::deep a, .top-row ::deep .btn-link { + white-space: nowrap; + margin-left: 1.5rem; + text-decoration: none; + } + + .top-row ::deep a:hover, .top-row ::deep .btn-link:hover { + text-decoration: underline; + } + + .top-row ::deep a:first-child { + overflow: hidden; + text-overflow: ellipsis; + } + +@media (max-width: 640.98px) { + .top-row { + justify-content: space-between; + } + + .top-row ::deep a, .top-row ::deep .btn-link { + margin-left: 0; + } +} + +@media (min-width: 641px) { + .page { + flex-direction: row; + } + + .sidebar { + width: 250px; + height: 100vh; + position: sticky; + top: 0; + } + + .top-row { + position: sticky; + top: 0; + z-index: 1; + } + + .top-row.auth ::deep a:first-child { + flex: 1; + text-align: right; + width: 0; + } + + .top-row, article { + padding-left: 2rem !important; + padding-right: 1.5rem !important; + } +} + +#blazor-error-ui { + background: lightyellow; + bottom: 0; + box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2); + display: none; + left: 0; + padding: 0.6rem 1.25rem 0.7rem 1.25rem; + position: fixed; + width: 100%; + z-index: 1000; +} + + #blazor-error-ui .dismiss { + cursor: pointer; + position: absolute; + right: 0.75rem; + top: 0.5rem; + } diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Layout/NavMenu.razor b/VSOP.WebApp/VSOP.WebApp.Client/Layout/NavMenu.razor index 0353827..c2f5353 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/Layout/NavMenu.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/Layout/NavMenu.razor @@ -1,7 +1,6 @@ -

NavMenu

-
+
- VSEOP + VSOP
@@ -28,3 +27,4 @@
+ diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Layout/NavMenu.razor.css b/VSOP.WebApp/VSOP.WebApp.Client/Layout/NavMenu.razor.css new file mode 100644 index 0000000..4e15395 --- /dev/null +++ b/VSOP.WebApp/VSOP.WebApp.Client/Layout/NavMenu.razor.css @@ -0,0 +1,105 @@ +.navbar-toggler { + appearance: none; + cursor: pointer; + width: 3.5rem; + height: 2.5rem; + color: white; + position: absolute; + top: 0.5rem; + right: 1rem; + border: 1px solid rgba(255, 255, 255, 0.1); + background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1); +} + +.navbar-toggler:checked { + background-color: rgba(255, 255, 255, 0.5); +} + +.top-row { + height: 3.5rem; + background-color: rgba(0,0,0,0.4); +} + +.navbar-brand { + font-size: 1.1rem; +} + +.bi { + display: inline-block; + position: relative; + width: 1.25rem; + height: 1.25rem; + margin-right: 0.75rem; + top: -1px; + background-size: cover; +} + +.bi-house-door-fill-nav-menu { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E"); +} + +.bi-plus-square-fill-nav-menu { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E"); +} + +.bi-list-nested-nav-menu { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E"); +} + +.nav-item { + font-size: 0.9rem; + padding-bottom: 0.5rem; +} + + .nav-item:first-of-type { + padding-top: 1rem; + } + + .nav-item:last-of-type { + padding-bottom: 1rem; + } + + .nav-item ::deep .nav-link { + color: #d7d7d7; + background: none; + border: none; + border-radius: 4px; + height: 3rem; + display: flex; + align-items: center; + line-height: 3rem; + width: 100%; + } + +.nav-item ::deep a.active { + background-color: rgba(255,255,255,0.37); + color: white; +} + +.nav-item ::deep .nav-link:hover { + background-color: rgba(255,255,255,0.1); + color: white; +} + +.nav-scrollable { + display: none; +} + +.navbar-toggler:checked ~ .nav-scrollable { + display: block; +} + +@media (min-width: 641px) { + .navbar-toggler { + display: none; + } + + .nav-scrollable { + /* Never collapse the sidebar for wide screens */ + display: block; + + /* Allow sidebar to scroll for tall menus */ + height: calc(100vh - 3.5rem); + overflow-y: auto; + } +} diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Pages/Counter.razor b/VSOP.WebApp/VSOP.WebApp.Client/Pages/Counter.razor index 6b9e8cb..ef23cb3 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/Pages/Counter.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/Pages/Counter.razor @@ -1,5 +1,4 @@ @page "/counter" -@rendermode InteractiveWebAssembly Counter diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Pages/Home.razor b/VSOP.WebApp/VSOP.WebApp.Client/Pages/Home.razor index 0a5e464..9001e0b 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/Pages/Home.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/Pages/Home.razor @@ -1,8 +1,7 @@ -

Home

-@page "/" +@page "/" Home

Hello, world!

-Welcome to your new app. \ No newline at end of file +Welcome to your new app. diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Pages/Weather.razor b/VSOP.WebApp/VSOP.WebApp.Client/Pages/Weather.razor index 43c9f3d..8eca4cc 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/Pages/Weather.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/Pages/Weather.razor @@ -1,5 +1,4 @@ -

Weather

-@page "/weather" +@page "/weather" Weather @@ -47,11 +46,11 @@ else var startDate = DateOnly.FromDateTime(DateTime.Now); var summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" }; forecasts = Enumerable.Range(1, 5).Select(index => new WeatherForecast - { - Date = startDate.AddDays(index), - TemperatureC = Random.Shared.Next(-20, 55), - Summary = summaries[Random.Shared.Next(summaries.Length)] - }).ToArray(); + { + Date = startDate.AddDays(index), + TemperatureC = Random.Shared.Next(-20, 55), + Summary = summaries[Random.Shared.Next(summaries.Length)] + }).ToArray(); } private class WeatherForecast @@ -61,4 +60,4 @@ else public string? Summary { get; set; } public int TemperatureF => 32 + (int)(TemperatureC / 0.5556); } -} \ No newline at end of file +} diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Program.cs b/VSOP.WebApp/VSOP.WebApp.Client/Program.cs index 4a43bc2..973c122 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/Program.cs +++ b/VSOP.WebApp/VSOP.WebApp.Client/Program.cs @@ -9,7 +9,6 @@ static async Task Main(string[] args) { var builder = WebAssemblyHostBuilder.CreateDefault(args); - builder.Services.AddTransient(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) }); builder.Services.AddRadzenComponents(); diff --git a/VSOP.WebApp/VSOP.WebApp.Client/Routes.razor b/VSOP.WebApp/VSOP.WebApp.Client/Routes.razor index 4a2e38e..f756e19 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/Routes.razor +++ b/VSOP.WebApp/VSOP.WebApp.Client/Routes.razor @@ -1,5 +1,4 @@ - - + diff --git a/VSOP.WebApp/VSOP.WebApp.Client/VSOP.WebApp.Client.csproj b/VSOP.WebApp/VSOP.WebApp.Client/VSOP.WebApp.Client.csproj index b7d54c0..c461e17 100644 --- a/VSOP.WebApp/VSOP.WebApp.Client/VSOP.WebApp.Client.csproj +++ b/VSOP.WebApp/VSOP.WebApp.Client/VSOP.WebApp.Client.csproj @@ -1,4 +1,4 @@ - + net8.0 @@ -13,8 +13,4 @@ - - - - diff --git a/VSOP.WebApp/VSOP.WebApp/Components/App.razor b/VSOP.WebApp/VSOP.WebApp/Components/App.razor index c928c2a..e7309c1 100644 --- a/VSOP.WebApp/VSOP.WebApp/Components/App.razor +++ b/VSOP.WebApp/VSOP.WebApp/Components/App.razor @@ -7,7 +7,7 @@ - + @@ -19,4 +19,4 @@ - + \ No newline at end of file diff --git a/VSOP.WebApp/VSOP.WebApp/Program.cs b/VSOP.WebApp/VSOP.WebApp/Program.cs index df48215..815a4e7 100644 --- a/VSOP.WebApp/VSOP.WebApp/Program.cs +++ b/VSOP.WebApp/VSOP.WebApp/Program.cs @@ -1,4 +1,5 @@ using Microsoft.OpenApi.Models; +using Radzen; using System.Reflection; using VSOP.Application; using VSOP.Persistence; @@ -12,6 +13,7 @@ public static void Main(string[] args) { var builder = WebApplication.CreateBuilder(args); + builder.Services.AddControllers(); #region SolutionDI's @@ -22,6 +24,7 @@ public static void Main(string[] args) // Add services to the container. builder.Services.AddRazorComponents() .AddInteractiveWebAssemblyComponents(); + builder.Services.AddRadzenComponents(); builder.Services.AddEndpointsApiExplorer();