From 440d3834be1fcc43e884bb3b44254f5e96ccd05a Mon Sep 17 00:00:00 2001 From: Phil Asmar Date: Sat, 21 Dec 2024 16:26:52 -0500 Subject: [PATCH] feat: added support for light/dark mode --- .../Components/App.razor | 6 +- .../Components/Layout/MainLayout.razor | 73 +- .../Components/Pages/Home.razor | 323 ++- .../Processes/TestToolProcess.cs | 1 + .../Services/IThemeService.cs | 20 + .../Services/ThemeService.cs | 35 + .../Amazon.Lambda.TestTool/wwwroot/app.css | 20 + .../wwwroot/aws-light.svg | 3 + .../Amazon.Lambda.TestTool/wwwroot/aws.svg | 4 +- .../bootstrap-icons/bootstrap-icons.css | 2078 ++++++++++++++++ .../bootstrap-icons/bootstrap-icons.json | 2052 ++++++++++++++++ .../bootstrap-icons/bootstrap-icons.min.css | 5 + .../bootstrap-icons/bootstrap-icons.scss | 2090 +++++++++++++++++ .../fonts/bootstrap-icons.woff | Bin 0 -> 176032 bytes .../fonts/bootstrap-icons.woff2 | Bin 0 -> 130396 bytes .../wwwroot/bootstrap/js/color-modes.js | 57 + 16 files changed, 6647 insertions(+), 120 deletions(-) create mode 100644 Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Services/IThemeService.cs create mode 100644 Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Services/ThemeService.cs create mode 100644 Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/wwwroot/aws-light.svg create mode 100644 Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/wwwroot/bootstrap-icons/bootstrap-icons.css create mode 100644 Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/wwwroot/bootstrap-icons/bootstrap-icons.json create mode 100644 Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/wwwroot/bootstrap-icons/bootstrap-icons.min.css create mode 100644 Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/wwwroot/bootstrap-icons/bootstrap-icons.scss create mode 100644 Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/wwwroot/bootstrap-icons/fonts/bootstrap-icons.woff create mode 100644 Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/wwwroot/bootstrap-icons/fonts/bootstrap-icons.woff2 create mode 100644 Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/wwwroot/bootstrap/js/color-modes.js diff --git a/Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Components/App.razor b/Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Components/App.razor index c3c01639c..9c67884b2 100644 --- a/Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Components/App.razor +++ b/Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Components/App.razor @@ -1,5 +1,5 @@  - + @@ -9,12 +9,14 @@ + - + + diff --git a/Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Components/Layout/MainLayout.razor b/Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Components/Layout/MainLayout.razor index 0df40924f..d90544240 100644 --- a/Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Components/Layout/MainLayout.razor +++ b/Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Components/Layout/MainLayout.razor @@ -1,10 +1,15 @@ -@using Amazon.Lambda.TestTool.Utilities +@using Amazon.Lambda.TestTool.Services +@using Amazon.Lambda.TestTool.Utilities @inherits LayoutComponentBase +@inject IJSRuntime Js +@inject IThemeService ThemeService + -
+
+
+
+ © @DateTime.Now.Year - AWS Lambda Test Tool +
+
+
An unhandled error has occurred. Reload 🗙
+ +@code { + + protected override async Task OnAfterRenderAsync(bool firstRender) + { + if (string.IsNullOrEmpty(ThemeService.CurrentTheme)) + { + ThemeService.CurrentTheme = await Js.InvokeAsync("getPreferredTheme"); + } + } + + private async Task SetLightTheme() + { + await SetTheme("light"); + } + + private async Task SetDarkTheme() + { + await SetTheme("dark"); + } + + private async Task SetTheme(string theme) + { + await Js.InvokeVoidAsync("setStoredTheme", theme); + await Js.InvokeVoidAsync("setTheme", theme); + ThemeService.CurrentTheme = theme; + } + +} diff --git a/Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Components/Pages/Home.razor b/Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Components/Pages/Home.razor index 486c9d415..14491f35a 100644 --- a/Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Components/Pages/Home.razor +++ b/Tools/LambdaTestTool-v2/src/Amazon.Lambda.TestTool/Components/Pages/Home.razor @@ -1,16 +1,16 @@ @page "/" -@using Amazon.Lambda.TestTool.Commands @using Amazon.Lambda.TestTool.Services @using Amazon.Lambda.TestTool.Models @using Amazon.Lambda.TestTool.SampleRequests; @using Amazon.Lambda.TestTool.Services.IO -@using Amazon.Lambda.TestTool.Utilities @using Microsoft.AspNetCore.Http; @inject IHttpContextAccessor HttpContextAccessor @inject IRuntimeApiDataStoreManager DataStoreManager @inject IDirectoryManager DirectoryManager +@inject IThemeService ThemeService +@inject IJSRuntime JsRuntime Lambda Function Tester @@ -22,11 +22,14 @@ Lambda function. More information can be found in the documentation.
-
-
+
+

Queue Event

- +
-
+
-
-