From baf1ec66c83e17c39f164f55abf334da251be4ec Mon Sep 17 00:00:00 2001 From: "Steven T. Cramer" Date: Sun, 26 May 2024 02:07:18 +0700 Subject: [PATCH 01/64] add CreateDummyQuickGridCSS --- .../Source/ContainerApps/Web/Web.Spa/Web.Spa.csproj | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Web.Spa.csproj b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Web.Spa.csproj index fe3f81e4..a1bfcc3e 100644 --- a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Web.Spa.csproj +++ b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Web.Spa.csproj @@ -109,4 +109,11 @@ + + + + + + + From 1233ca68d5793dec3af362c73b2e40d2403e2819 Mon Sep 17 00:00:00 2001 From: "Steven T. Cramer" Date: Sun, 26 May 2024 12:48:41 +0700 Subject: [PATCH 02/64] Don't use _ContentIncludedByDefault Remove= Rider puts it in there for no good reason. --- .../Source/ContainerApps/Web/Web.Spa/Web.Spa.csproj | 6 ------ 1 file changed, 6 deletions(-) diff --git a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Web.Spa.csproj b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Web.Spa.csproj index a1bfcc3e..ea53e72c 100644 --- a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Web.Spa.csproj +++ b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Web.Spa.csproj @@ -80,12 +80,6 @@ - - <_ContentIncludedByDefault Remove="Pages\Authentication\ProfilePage.razor" /> - <_ContentIncludedByDefault Remove="Pages\Authentication\SettingsPage.razor" /> - <_ContentIncludedByDefault Remove="Pages\Authentication\_Imports.razor" /> - - Date: Sun, 26 May 2024 17:42:00 +0700 Subject: [PATCH 03/64] Update to include Pane and Area. --- .../ComponentNamingAndOrganization.md | 36 +++++++++++++++++-- 1 file changed, 34 insertions(+), 2 deletions(-) diff --git a/TimeWarp.Architecture/Documentation/Developer/Conceptual/ComponentNamingAndOrganization.md b/TimeWarp.Architecture/Documentation/Developer/Conceptual/ComponentNamingAndOrganization.md index 6cd42f94..94e57704 100644 --- a/TimeWarp.Architecture/Documentation/Developer/Conceptual/ComponentNamingAndOrganization.md +++ b/TimeWarp.Architecture/Documentation/Developer/Conceptual/ComponentNamingAndOrganization.md @@ -123,7 +123,7 @@ These components represent modal dialogs used for user interactions that require ### Section Components -Section components represent significant parts of a page but do not have their own routes. They are larger than widgets and can encapsulate substantial functionality, often comprising multiple widgets or other components. Sections are integral parts of a page layout, contributing to the overall structure and functionality of a feature. +Section components represent significant parts of a page but do not have their own routes. Sections are integral parts of a page layout, contributing to the overall structure and functionality of a feature. **Naming Convention:** - Suffix: `Section` @@ -139,12 +139,44 @@ Section components represent significant parts of a page but do not have their o ### Widget Components -These components are small, self-contained, and focused on a specific piece of functionality or UI element. They are often used to create a modular and reusable interface. +These components are self-contained, and focused on a specific piece of functionality or UI element. They are often used to create a modular and reusable interface. For example, a weather widget that displays the current weather conditions. And can be placed on a dashboard. Widgets can contain Sections, Forms, Tables, Charts, and Dialogs. **Naming Convention:** - Suffix: `Widget` - Example: `WeatherWidget.razor` +## Layout Component Naming Conventions + +Components that define the layout of a page or a section of a page. These components are used to structure the UI and organize the content. + +### Pane Components + +Pane components are explicitly `FluentMultiSplitterPane` contents. They are used within `FluentMultiSplitter` components to divide the layout into resizable panes. + +**Naming Convention:** +- Suffix: `Pane` +- Example: `LeftPane.razor` + +**Usage Example:** +```html + + + + + + + + +``` + +### Area Components + +Area components are containers that are not panes. They serve as organizational units within a page, often grouping related content. + +**Naming Convention:** +- Suffix: `Area` +- Example: `SiteArea.razor` + ## Example Directory Structure ``` From bd8782df5a264ece7eedc8d3dacf0efedf35e131 Mon Sep 17 00:00:00 2001 From: "Steven T. Cramer" Date: Sun, 26 May 2024 23:01:01 +0700 Subject: [PATCH 04/64] Add blazor error styles (framework) Add placeholder style to show missing content. --- .../Web/Web.Spa/Styles/input.css | 39 +++++++++++++++++++ 1 file changed, 39 insertions(+) diff --git a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Styles/input.css b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Styles/input.css index bf8a1672..0310b6c1 100644 --- a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Styles/input.css +++ b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Styles/input.css @@ -3,3 +3,42 @@ @tailwind base; @tailwind components; @tailwind utilities; + +/* Custom base styles (if any) */ +@layer base { + /* Add any custom base styles here */ +} + +/* Custom component styles */ +@layer components { + #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; + margin: 20px 0; + } + + #blazor-error-ui .dismiss { + cursor: pointer; + position: absolute; + right: 0.75rem; + top: 0.5rem; + } + + .placeholder { + width: 100%; + border: 4px dashed var(--neutral-foreground-rest); + border-radius: 0.5rem; + } +} + +/* Custom utility styles */ +@layer utilities { + +} From cc4205530dbe1881749e9a47c6aa0ce9446d25af Mon Sep 17 00:00:00 2001 From: "Steven T. Cramer" Date: Sun, 26 May 2024 23:02:18 +0700 Subject: [PATCH 05/64] Add fluent.css this is where we pic up all the Fluent styles used. may need to add more as I use more components. --- .../Source/ContainerApps/Web/Web.Spa/wwwroot/css/fluent.css | 3 +++ 1 file changed, 3 insertions(+) create mode 100644 TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/wwwroot/css/fluent.css diff --git a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/wwwroot/css/fluent.css b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/wwwroot/css/fluent.css new file mode 100644 index 00000000..c6670403 --- /dev/null +++ b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/wwwroot/css/fluent.css @@ -0,0 +1,3 @@ +@import '/_content/Microsoft.FluentUI.AspNetCore.Components/css/reboot.css'; +@import '/_content/Microsoft.FluentUI.AspNetCore.Components/Microsoft.FluentUI.AspNetCore.Components.bundle.scp.css'; +@import '/_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.bundle.scp.css'; From 620c610183237507c2831d0b051b35bbff94f879 Mon Sep 17 00:00:00 2001 From: "Steven T. Cramer" Date: Sun, 26 May 2024 23:03:28 +0700 Subject: [PATCH 06/64] Remove sidebars from global using as I'm trying to avoid name conflicts while I remove the old Sidbar page and replace all to use the TimeWarpPage.razor --- .../Source/ContainerApps/Web/Web.Spa/_Imports.razor | 1 - 1 file changed, 1 deletion(-) diff --git a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/_Imports.razor b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/_Imports.razor index 7fba6aff..9d489977 100644 --- a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/_Imports.razor +++ b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/_Imports.razor @@ -17,7 +17,6 @@ @using TimeWarp.Architecture.Features.Debugger.Components @using TimeWarp.Architecture.Features.EventStreams @using TimeWarp.Architecture.Features.ProfileMenus.Components -@using TimeWarp.Architecture.Features.Sidebars; @using TimeWarp.Architecture.Features.ToDo @using TimeWarp.Architecture.Features.ToDo.Components @using TimeWarp.Architecture.Pages From 2a33d83bf8c5caac01fb6d0ed1f6bc8f6526c8ac Mon Sep 17 00:00:00 2001 From: "Steven T. Cramer" Date: Sun, 26 May 2024 23:04:08 +0700 Subject: [PATCH 07/64] formatting --- .../Application/Components/NavBar/Components/Logo.razor | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Features/Application/Components/NavBar/Components/Logo.razor b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Features/Application/Components/NavBar/Components/Logo.razor index 4bdf901e..1174337d 100644 --- a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Features/Application/Components/NavBar/Components/Logo.razor +++ b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Features/Application/Components/NavBar/Components/Logo.razor @@ -1,5 +1,3 @@ -@namespace TimeWarp.Architecture.Features.Applications.Components.NavBars.Dark -@inherits BaseComponent +@inherits BaseComponent - From af0566d2bd125e252e5c9b1279dcd628efde7109 Mon Sep 17 00:00:00 2001 From: "Steven T. Cramer" Date: Sun, 26 May 2024 23:04:23 +0700 Subject: [PATCH 08/64] add explicit using --- .../Features/Application/Components/NavBar/DarkNavBar.razor | 2 ++ 1 file changed, 2 insertions(+) diff --git a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Features/Application/Components/NavBar/DarkNavBar.razor b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Features/Application/Components/NavBar/DarkNavBar.razor index c5e50e56..5a15bfb5 100644 --- a/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Features/Application/Components/NavBar/DarkNavBar.razor +++ b/TimeWarp.Architecture/Source/ContainerApps/Web/Web.Spa/Features/Application/Components/NavBar/DarkNavBar.razor @@ -1,5 +1,7 @@ @namespace TimeWarp.Architecture.Features.Applications.Components.NavBars.Dark +@using TimeWarp.Architecture.Features.Application.Components.NavBar.Components +