From b5486ed5f1458408f4c5526e7efb4a7f83cbb7cf Mon Sep 17 00:00:00 2001 From: Saleh Yusefnejad Date: Sun, 25 Aug 2024 23:22:00 +0330 Subject: [PATCH 01/34] 1st commit --- .../Bit.BlazorUI/Components/BitColor.cs | 45 ++++++++- .../Buttons/BitButton/BitButton.razor.cs | 8 ++ .../Buttons/BitButton/BitButton.scss | 64 ++++++++++++ .../Styles/Fluent/colors.fluent-dark.scss | 6 ++ .../Styles/Fluent/colors.fluent-light.scss | 6 ++ .../Bit.BlazorUI/Styles/theme-variables.scss | 6 ++ .../Components/Buttons/BitButtonDemo.razor | 98 ++++++++++--------- 7 files changed, 186 insertions(+), 47 deletions(-) diff --git a/src/BlazorUI/Bit.BlazorUI/Components/BitColor.cs b/src/BlazorUI/Bit.BlazorUI/Components/BitColor.cs index 0a8d9fe169..da8aa343b5 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/BitColor.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/BitColor.cs @@ -43,5 +43,48 @@ public enum BitColor /// /// Error general color. /// - Error + Error, + + + /// + /// Primary background color. + /// + PrimaryBackground, + + /// + /// Secondary background color. + /// + SecondaryBackground, + + /// + /// Tertiary background color. + /// + TertiaryBackground, + + + /// + /// Primary foreground color. + /// + PrimaryForeground, + + /// + /// Secondary foreground color. + /// + SecondaryForeground, + + /// + /// Tertiary foreground color. + /// + TertiaryForeground, + + + /// + /// Primary border color. + /// + PrimaryBorder, + + /// + /// Secondary border color. + /// + SecondaryBorder } diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.razor.cs index 840f337024..b58472ab6b 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.razor.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.razor.cs @@ -182,6 +182,14 @@ protected override void RegisterCssClasses() BitColor.Warning => "bit-btn-wrn", BitColor.SevereWarning => "bit-btn-swr", BitColor.Error => "bit-btn-err", + BitColor.PrimaryBackground => "bit-btn-pbg", + BitColor.SecondaryBackground => "bit-btn-sbg", + BitColor.TertiaryBackground => "bit-btn-tbg", + BitColor.PrimaryForeground => "bit-btn-pfg", + BitColor.SecondaryForeground => "bit-btn-sfg", + BitColor.TertiaryForeground => "bit-btn-tfg", + BitColor.PrimaryBorder => "bit-btn-pbr", + BitColor.SecondaryBorder => "bit-btn-sbr", _ => "bit-btn-pri" }); diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.scss b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.scss index e7ac6d60d2..b6d8266960 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.scss +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.scss @@ -214,6 +214,70 @@ --bit-btn-clr-spn: #{$clr-err-dark}; } +.bit-btn-pbg { + --bit-btn-clr-txt: #{$clr-fg-pri}; + --bit-btn-clr: #{$clr-bg-pri}; + --bit-btn-clr-hover: #{$clr-bg-pri-hover}; + --bit-btn-clr-active: #{$clr-bg-pri-active}; + --bit-btn-clr-spn: #{$clr-fg-pri}; +} + +.bit-btn-sbg { + --bit-btn-clr-txt: #{$clr-fg-pri}; + --bit-btn-clr: #{$clr-bg-sec}; + --bit-btn-clr-hover: #{$clr-bg-sec-hover}; + --bit-btn-clr-active: #{$clr-bg-sec-active}; + --bit-btn-clr-spn: #{$clr-fg-pri}; +} + +.bit-btn-tbg { + --bit-btn-clr-txt: #{$clr-fg-pri}; + --bit-btn-clr: #{$clr-bg-ter}; + --bit-btn-clr-hover: #{$clr-bg-ter-hover}; + --bit-btn-clr-active: #{$clr-bg-ter-active}; + --bit-btn-clr-spn: #{$clr-fg-pri}; +} + +.bit-btn-pfg { + --bit-btn-clr-txt: #{$clr-bg-pri}; + --bit-btn-clr: #{$clr-fg-pri}; + --bit-btn-clr-hover: #{$clr-fg-pri-hover}; + --bit-btn-clr-active: #{$clr-fg-pri-active}; + --bit-btn-clr-spn: #{$clr-bg-pri}; +} + +.bit-btn-sfg { + --bit-btn-clr-txt: #{$clr-bg-pri}; + --bit-btn-clr: #{$clr-fg-sec}; + --bit-btn-clr-hover: #{$clr-fg-sec-hover}; + --bit-btn-clr-active: #{$clr-fg-sec-active}; + --bit-btn-clr-spn: #{$clr-bg-pri}; +} + +.bit-btn-tfg { + --bit-btn-clr-txt: #{$clr-bg-pri}; + --bit-btn-clr: #{$clr-fg-ter}; + --bit-btn-clr-hover: #{$clr-fg-ter-hover}; + --bit-btn-clr-active: #{$clr-fg-ter-active}; + --bit-btn-clr-spn: #{$clr-bg-pri}; +} + +.bit-btn-pbr { + --bit-btn-clr-txt: #{$clr-bg-pri}; + --bit-btn-clr: #{$clr-brd-pri}; + --bit-btn-clr-hover: #{$clr-brd-pri-hover}; + --bit-btn-clr-active: #{$clr-brd-pri-active}; + --bit-btn-clr-spn: #{$clr-fg-pri}; +} + +.bit-btn-sbr { + --bit-btn-clr-txt: #{$clr-fg-pri}; + --bit-btn-clr: #{$clr-brd-sec}; + --bit-btn-clr-hover: #{$clr-brd-sec-hover}; + --bit-btn-clr-active: #{$clr-brd-sec-active}; + --bit-btn-clr-spn: #{$clr-fg-pri}; +} + .bit-btn-sm { --bit-btn-spn-size: #{spacing(1.75)}; diff --git a/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scss b/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scss index 58f9a1da6d..8bb3d4615c 100644 --- a/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scss +++ b/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scss @@ -96,6 +96,9 @@ --bit-clr-fg-sec: #B9B9B9; --bit-clr-fg-sec-hover: #AAA; --bit-clr-fg-sec-active: #999; + --bit-clr-fg-ter: #B9B9B9; + --bit-clr-fg-ter-hover: #AAA; + --bit-clr-fg-ter-active: #999; --bit-clr-fg-dis: #444; //backgrounds --bit-clr-bg-pri: #010409; @@ -104,6 +107,9 @@ --bit-clr-bg-sec: #161B22; --bit-clr-bg-sec-hover: #1C222B; --bit-clr-bg-sec-active: #202731; + --bit-clr-bg-ter: #161B22; + --bit-clr-bg-ter-hover: #1C222B; + --bit-clr-bg-ter-active: #202731; --bit-clr-bg-dis: #222; --bit-clr-bg-overlay: rgba(255, 255, 255, 0.2); //borders diff --git a/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scss b/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scss index a3ee3031de..b3eee08155 100644 --- a/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scss +++ b/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scss @@ -98,6 +98,9 @@ --bit-clr-fg-sec: #5A5A5A; --bit-clr-fg-sec-hover: #444; --bit-clr-fg-sec-active: #333; + --bit-clr-fg-ter: #5A5A5A; + --bit-clr-fg-ter-hover: #444; + --bit-clr-fg-ter-active: #333; --bit-clr-fg-dis: #AAA; //backgrounds --bit-clr-bg-pri: #FFF; @@ -106,6 +109,9 @@ --bit-clr-bg-sec: #FAF9F8; --bit-clr-bg-sec-hover: #DDD; --bit-clr-bg-sec-active: #CCC; + --bit-clr-bg-ter: #FAF9F8; + --bit-clr-bg-ter-hover: #DDD; + --bit-clr-bg-ter-active: #CCC; --bit-clr-bg-dis: #F3F2F1; --bit-clr-bg-overlay: rgba(0, 0, 0, 0.4); //borders diff --git a/src/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scss b/src/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scss index 94dbf4b5d8..cdcf0f3488 100644 --- a/src/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scss +++ b/src/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scss @@ -102,6 +102,9 @@ $clr-fg-pri-active: var(--bit-clr-fg-pri-active); $clr-fg-sec: var(--bit-clr-fg-sec); $clr-fg-sec-hover: var(--bit-clr-fg-sec-hover); $clr-fg-sec-active: var(--bit-clr-fg-sec-active); +$clr-fg-ter: var(--bit-clr-fg-ter); +$clr-fg-ter-hover: var(--bit-clr-fg-ter-hover); +$clr-fg-ter-active: var(--bit-clr-fg-ter-active); $clr-fg-dis: var(--bit-clr-fg-dis); //backgrounds @@ -111,6 +114,9 @@ $clr-bg-pri-active: var(--bit-clr-bg-pri-active); $clr-bg-sec: var(--bit-clr-bg-sec); $clr-bg-sec-hover: var(--bit-clr-bg-sec-hover); $clr-bg-sec-active: var(--bit-clr-bg-sec-active); +$clr-bg-ter: var(--bit-clr-bg-ter); +$clr-bg-ter-hover: var(--bit-clr-bg-ter-hover); +$clr-bg-ter-active: var(--bit-clr-bg-ter-active); $clr-bg-dis: var(--bit-clr-bg-dis); $clr-bg-overlay: var(--bit-clr-bg-overlay); diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitButtonDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitButtonDemo.razor index 0a940b3268..791663af24 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitButtonDemo.razor +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitButtonDemo.razor @@ -339,94 +339,100 @@ Primary
-
- Primary - Primary - Primary -
-

Secondary Secondary Secondary

-
- Secondary - Secondary - Secondary -
-

Tertiary Tertiary Tertiary

-
- Tertiary - Tertiary - Tertiary -
-
Info Info Info

-
- Info - Info - Info -
-

Success Success Success

-
- Success - Success - Success -
-

Warning Warning Warning

-
- Warning - Warning - Warning -
-

SevereWarning SevereWarning SevereWarning

-
- SevereWarning - SevereWarning - SevereWarning -
-

Error Error Error

-
- Error - Error - Error +
+
+ PrimaryBackground + PrimaryBackground + PrimaryBackground +
+
+
+ SecondaryBackground + SecondaryBackground + SecondaryBackground +
+
+
+ TertiaryBackground + TertiaryBackground + TertiaryBackground +
+
+
+
+
+ PrimaryForeground + PrimaryForeground + PrimaryForeground +
+
+
+ SecondaryForeground + SecondaryForeground + SecondaryForeground +
+
+
+ TertiaryForeground + TertiaryForeground + TertiaryForeground +
+
+
+
+
+ PrimaryBorder + PrimaryBorder + PrimaryBorder +
+
+
+ SecondaryBorder + SecondaryBorder + SecondaryBorder +
From 18603f59bbcb76ac85fb897f24aab797fa414c39 Mon Sep 17 00:00:00 2001 From: Saleh Yusefnejad Date: Mon, 26 Aug 2024 16:08:15 +0330 Subject: [PATCH 02/34] 1st commit --- .../Components/Layout/EmptyLayout.razor | 5 + .../Layout/Identity/IdentityHeader.razor | 0 .../Layout/Identity/IdentityHeader.razor.cs | 5 + .../Layout/Identity/IdentityHeader.razor.scss | 0 .../Layout/Identity/IdentityLayout.razor | 8 + .../Layout/Identity/IdentityLayout.razor.scss | 148 ++++++++++++++++++ .../Components/Layout/MainLayout.razor | 26 +-- .../Components/Pages/Identity/_Imports.razor | 1 + .../Boilerplate.Client.Core/_Imports.razor | 3 +- .../Boilerplate.Server.Web/appsettings.json | 76 +++++++++ 10 files changed, 258 insertions(+), 14 deletions(-) create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/EmptyLayout.razor create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.cs create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.scss create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor.scss create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/_Imports.razor diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/EmptyLayout.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/EmptyLayout.razor new file mode 100644 index 0000000000..ecd2281dc7 --- /dev/null +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/EmptyLayout.razor @@ -0,0 +1,5 @@ +@inherits LayoutComponentBase + + + @Body + \ No newline at end of file diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.cs new file mode 100644 index 0000000000..0a8db9f087 --- /dev/null +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.cs @@ -0,0 +1,5 @@ +namespace Boilerplate.Client.Core.Components.Layout.Identity; + +public partial class IdentityHeader +{ +} diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.scss b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor new file mode 100644 index 0000000000..e3119fe514 --- /dev/null +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor @@ -0,0 +1,8 @@ +@inherits LayoutComponentBase + +
+ + + @Body + +
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor.scss b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor.scss new file mode 100644 index 0000000000..7454fe0263 --- /dev/null +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor.scss @@ -0,0 +1,148 @@ +@import '../../../Styles/abstracts/_vars.scss'; +@import '../../../Styles/abstracts/_functions.scss'; +@import '../../../Styles/abstracts/_media-queries.scss'; +@import '../../../Styles/abstracts/_bit-css-variables.scss'; + +.layout { + width: 100%; + height: 100%; +} + +main { + width: 100%; + display: flex; + min-height: 100vh; + position: relative; + box-sizing: border-box; + justify-content: flex-start; + padding-bottom: $footerHeight; + background-color: $bit-color-background-primary; + padding-top: calc($headerHeight + var(--bit-status-bar-height)); + + .bit-ios & { + padding-top: calc($headerHeight + env(safe-area-inset-top)); + padding-bottom: calc($footerHeight + env(safe-area-inset-bottom)); + } +} + +.main-content { + flex-grow: 1; + display: flex; + padding: 1rem; + min-height: 100%; + flex-flow: column; + align-items: center; + justify-content: center; + width: calc(100% - $navMenuWidth); + background-color: $bit-color-background-secondary; + + @include lt-lg { + width: 100%; + } +} + +.status-bar { + top: 0; + width: 100%; + z-index: 101; + display: none; + position: fixed; + overflow: hidden; + text-align: center; + align-items: center; + font-size: rem2(14px); + justify-content: center; + background-color: transparent; + + .bit-ios & { + display: flex; + color: transparent; + height: env(safe-area-inset-top); + } + + .bit-windows &, .bit-macos & { + display: flex; + height: var(--bit-status-bar-height); + } +} + +::deep { + .form { + width: 100%; + display: flex; + position: relative; + text-align: center; + align-items: center; + max-width: rem2(504px); + justify-content: center; + flex-flow: column nowrap; + border-radius: rem2(4px); + padding: rem2(48px) rem2(16px); + box-shadow: $bit-box-shadow-callout; + background-color: $bit-color-background-primary; + } + + .form-title { + font-weight: 600; + font-size: rem2(28px); + line-height: rem2(44px); + margin-bottom: rem2(25px); + + @include lg { + font-size: rem2(24px); + line-height: rem2(36px); + } + + @include md { + font-size: rem2(22px); + line-height: rem2(36px); + } + + @include sm { + font-size: rem2(20px); + line-height: rem2(32px); + } + } + + .form-input-container { + width: 100%; + display: flex; + text-align: start; + max-width: rem2(300px); + flex-flow: column nowrap; + margin-bottom: rem2(21px); + } + + .form-input-error, + .validation-message { + text-align: start; + font-size: rem2(12px); + line-height: rem2(16px); + color: $bit-color-error; + } + + .form-submit-button { + margin-top: rem2(20px); + margin-bottom: rem2(10px); + } + + .form-message-bar { + width: 100%; + position: absolute; + text-align: center; + inset-block-start: 0; + inset-inline-start: 0; + border-radius: rem2(4px) rem2(4px) 0 0; + scroll-margin-top: calc($headerHeight + var(--bit-status-bar-height) + 1px); + } +} + +.bit-ios { + ::deep .form-message-bar { + scroll-margin-top: calc($headerHeight + env(safe-area-inset-top) + 1px); + } +} + +::deep .loading-container { + text-align: center; +} diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/MainLayout.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/MainLayout.razor index bb7abc679c..6e2c08a080 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/MainLayout.razor +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/MainLayout.razor @@ -4,21 +4,21 @@
-
+ @*
*@ -
- @if (isUserAuthenticated) - { - - } -
- - @Body - -
-
+ @*
+ @if (isUserAuthenticated) + { + + } +
*@ + + @Body + + @*
+
*@ -
+ @*
*@
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/_Imports.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/_Imports.razor new file mode 100644 index 0000000000..1a3a5141a8 --- /dev/null +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/Identity/_Imports.razor @@ -0,0 +1 @@ +@layout IdentityLayout \ No newline at end of file diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/_Imports.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/_Imports.razor index 5b78a959bb..13b8bca2f0 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/_Imports.razor +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/_Imports.razor @@ -19,6 +19,7 @@ @using Boilerplate.Client.Core @using Boilerplate.Client.Core.Services @using Boilerplate.Client.Core.Components -@using Boilerplate.Client.Core.Components.Layout @using Boilerplate.Client.Core.Components.Pages +@using Boilerplate.Client.Core.Components.Layout @using Boilerplate.Client.Core.Services.Contracts +@using Boilerplate.Client.Core.Components.Layout.Identity diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json index 4f902ee228..c3ee70b9e5 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json @@ -1,4 +1,80 @@ { + "ConnectionStrings": { + //#if (database == "SqlServer") + "SqlServerConnectionString": "Data Source=(localdb)\\mssqllocaldb; Initial Catalog=BoilerplateDb;Integrated Security=true;Application Name=Boilerplate;TrustServerCertificate=True;", + //#elif (database == "Sqlite") + "SqliteConnectionString": "Data Source=App_Data/BoilerplateDb.db;", + "SqliteConnectionString_Comment": "To debug inside docker, change ConnectionStrings__SqliteConnectionString's value in launchSettings.json", + //#elif (database == "PostgreSQL") + "PostgreSQLConnectionString": "User ID=postgres;Password=postgres;Host=localhost;Database=BoilerplateDb;", + //#elif (database == "Cosmos") + "CosmosConnectionString": "AccountEndpoint=https://localhost:8081/;AccountKey=C2y6yDjf5/R+ob0N8A7Cgv30VRDJIWEHLM+4QDU5DE2nQ9nDuVTqobD4b8mGGyPMbIZnqyMsEcaGQy67XIw/Jw==;", + //#elif (database == "MySql") + "MySqlSQLConnectionString": "Server=localhost;Port=3306;Database=BoilerplateDb;Uid=root;Pwd=123456;", + //#endif + //#if (filesStorage == "AzureBlobStorage") + "AzureBlobStorageSasUrl": "emulator", + "AzureBlobStorageSasUrl_Comment": "More info about blob storage sas url at https://learn.microsoft.com/en-us/azure/ai-services/translator/document-translation/how-to-guides/create-sas-tokens?tabs=blobs#create-sas-tokens-in-the-azure-portal" + //#endif + }, + "DataProtectionCertificatePassword": "P@ssw0rdP@ssw0rd", + "DataProtectionCertificatePassword_Comment": "It can also be configured using: dotnet user-secrets set 'DataProtectionCertificatePassword' 'P@ssw0rdP@ssw0rd'", + "AppSettings": { + "Identity": { + "Issuer": "Boilerplate", + "Audience": "Boilerplate", + "BearerTokenExpiration": "0.00:05:00", + "BearerTokenExpiration_Comment": "BearerTokenExpiration used as jwt's expiration claim, access token's expires in and cookie's max age. Format: D.HH:mm:ss", + "RefreshTokenExpiration": "14.00:00:00", + "EmailTokenRequestResendDelay": "0.00:02:00", + "PhoneNumberTokenRequestResendDelay": "0.00:02:00", + "ResetPasswordTokenRequestResendDelay": "0.00:02:00", + "TwoFactorTokenRequestResendDelay": "0.00:02:00", + "RevokeUserSessionsDelay": "1.00:00:00", + "OtpRequestResendDelay": "0.00:02:00", + "Password": { + "RequireDigit": "false", + "RequiredLength": "6", + "RequireNonAlphanumeric": "false", + "RequireUppercase": "false", + "RequireLowercase": "false" + }, + "SignIn": { + "RequireConfirmedAccount": true + } + }, + "Email": { + "Host": "LocalFolder", + "Host_Comment": "Local folder means storing emails as .eml file in App_Data/sent-emails folder (Recommended for testing purposes only) instead of sending them using smtp server.", + "Port": "587", + "DefaultFromEmail": "info@Boilerplate.com", + "UserName": null, + "Password": null + }, + "Sms": { + "FromPhoneNumber": null, + "TwilioAccountSid": null, + "TwilioAutoToken": null + }, + "UserProfileImagesDir": "attachments/profiles/", + //#if (captcha == "reCaptcha") + "GoogleRecaptchaSecretKey": "6LdMKr4pAAAAANvngWNam_nlHzEDJ2t6SfV6L_DS" + //#endif + }, + "Authentication": { + "Google": { + "ClientId": "", + "ClientSecret": "" + }, + "GitHub": { + "ClientId": "", + "ClientSecret": "" + }, + "Twitter": { + "ConsumerKey": "", + "ConsumerSecret": "" + } + }, "AllowedHosts": "*", "ForwardedHeaders": { "ForwardedHeaders_Comment": "These values apply only if your backend is hosted behind a CDN (such as Cloudflare).", From 2f246541055ed7029c9e755d5cbd443ce63a2133 Mon Sep 17 00:00:00 2001 From: Saleh Yusefnejad Date: Tue, 27 Aug 2024 21:55:41 +0330 Subject: [PATCH 03/34] Revert "1st commit" This reverts commit b5486ed5f1458408f4c5526e7efb4a7f83cbb7cf. --- .../Bit.BlazorUI/Components/BitColor.cs | 45 +-------- .../Buttons/BitButton/BitButton.razor.cs | 8 -- .../Buttons/BitButton/BitButton.scss | 64 ------------ .../Styles/Fluent/colors.fluent-dark.scss | 6 -- .../Styles/Fluent/colors.fluent-light.scss | 6 -- .../Bit.BlazorUI/Styles/theme-variables.scss | 6 -- .../Components/Buttons/BitButtonDemo.razor | 98 +++++++++---------- 7 files changed, 47 insertions(+), 186 deletions(-) diff --git a/src/BlazorUI/Bit.BlazorUI/Components/BitColor.cs b/src/BlazorUI/Bit.BlazorUI/Components/BitColor.cs index da8aa343b5..0a8d9fe169 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/BitColor.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/BitColor.cs @@ -43,48 +43,5 @@ public enum BitColor /// /// Error general color. /// - Error, - - - /// - /// Primary background color. - /// - PrimaryBackground, - - /// - /// Secondary background color. - /// - SecondaryBackground, - - /// - /// Tertiary background color. - /// - TertiaryBackground, - - - /// - /// Primary foreground color. - /// - PrimaryForeground, - - /// - /// Secondary foreground color. - /// - SecondaryForeground, - - /// - /// Tertiary foreground color. - /// - TertiaryForeground, - - - /// - /// Primary border color. - /// - PrimaryBorder, - - /// - /// Secondary border color. - /// - SecondaryBorder + Error } diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.razor.cs index b58472ab6b..840f337024 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.razor.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.razor.cs @@ -182,14 +182,6 @@ protected override void RegisterCssClasses() BitColor.Warning => "bit-btn-wrn", BitColor.SevereWarning => "bit-btn-swr", BitColor.Error => "bit-btn-err", - BitColor.PrimaryBackground => "bit-btn-pbg", - BitColor.SecondaryBackground => "bit-btn-sbg", - BitColor.TertiaryBackground => "bit-btn-tbg", - BitColor.PrimaryForeground => "bit-btn-pfg", - BitColor.SecondaryForeground => "bit-btn-sfg", - BitColor.TertiaryForeground => "bit-btn-tfg", - BitColor.PrimaryBorder => "bit-btn-pbr", - BitColor.SecondaryBorder => "bit-btn-sbr", _ => "bit-btn-pri" }); diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.scss b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.scss index b6d8266960..e7ac6d60d2 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.scss +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButton/BitButton.scss @@ -214,70 +214,6 @@ --bit-btn-clr-spn: #{$clr-err-dark}; } -.bit-btn-pbg { - --bit-btn-clr-txt: #{$clr-fg-pri}; - --bit-btn-clr: #{$clr-bg-pri}; - --bit-btn-clr-hover: #{$clr-bg-pri-hover}; - --bit-btn-clr-active: #{$clr-bg-pri-active}; - --bit-btn-clr-spn: #{$clr-fg-pri}; -} - -.bit-btn-sbg { - --bit-btn-clr-txt: #{$clr-fg-pri}; - --bit-btn-clr: #{$clr-bg-sec}; - --bit-btn-clr-hover: #{$clr-bg-sec-hover}; - --bit-btn-clr-active: #{$clr-bg-sec-active}; - --bit-btn-clr-spn: #{$clr-fg-pri}; -} - -.bit-btn-tbg { - --bit-btn-clr-txt: #{$clr-fg-pri}; - --bit-btn-clr: #{$clr-bg-ter}; - --bit-btn-clr-hover: #{$clr-bg-ter-hover}; - --bit-btn-clr-active: #{$clr-bg-ter-active}; - --bit-btn-clr-spn: #{$clr-fg-pri}; -} - -.bit-btn-pfg { - --bit-btn-clr-txt: #{$clr-bg-pri}; - --bit-btn-clr: #{$clr-fg-pri}; - --bit-btn-clr-hover: #{$clr-fg-pri-hover}; - --bit-btn-clr-active: #{$clr-fg-pri-active}; - --bit-btn-clr-spn: #{$clr-bg-pri}; -} - -.bit-btn-sfg { - --bit-btn-clr-txt: #{$clr-bg-pri}; - --bit-btn-clr: #{$clr-fg-sec}; - --bit-btn-clr-hover: #{$clr-fg-sec-hover}; - --bit-btn-clr-active: #{$clr-fg-sec-active}; - --bit-btn-clr-spn: #{$clr-bg-pri}; -} - -.bit-btn-tfg { - --bit-btn-clr-txt: #{$clr-bg-pri}; - --bit-btn-clr: #{$clr-fg-ter}; - --bit-btn-clr-hover: #{$clr-fg-ter-hover}; - --bit-btn-clr-active: #{$clr-fg-ter-active}; - --bit-btn-clr-spn: #{$clr-bg-pri}; -} - -.bit-btn-pbr { - --bit-btn-clr-txt: #{$clr-bg-pri}; - --bit-btn-clr: #{$clr-brd-pri}; - --bit-btn-clr-hover: #{$clr-brd-pri-hover}; - --bit-btn-clr-active: #{$clr-brd-pri-active}; - --bit-btn-clr-spn: #{$clr-fg-pri}; -} - -.bit-btn-sbr { - --bit-btn-clr-txt: #{$clr-fg-pri}; - --bit-btn-clr: #{$clr-brd-sec}; - --bit-btn-clr-hover: #{$clr-brd-sec-hover}; - --bit-btn-clr-active: #{$clr-brd-sec-active}; - --bit-btn-clr-spn: #{$clr-fg-pri}; -} - .bit-btn-sm { --bit-btn-spn-size: #{spacing(1.75)}; diff --git a/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scss b/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scss index 8bb3d4615c..58f9a1da6d 100644 --- a/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scss +++ b/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-dark.scss @@ -96,9 +96,6 @@ --bit-clr-fg-sec: #B9B9B9; --bit-clr-fg-sec-hover: #AAA; --bit-clr-fg-sec-active: #999; - --bit-clr-fg-ter: #B9B9B9; - --bit-clr-fg-ter-hover: #AAA; - --bit-clr-fg-ter-active: #999; --bit-clr-fg-dis: #444; //backgrounds --bit-clr-bg-pri: #010409; @@ -107,9 +104,6 @@ --bit-clr-bg-sec: #161B22; --bit-clr-bg-sec-hover: #1C222B; --bit-clr-bg-sec-active: #202731; - --bit-clr-bg-ter: #161B22; - --bit-clr-bg-ter-hover: #1C222B; - --bit-clr-bg-ter-active: #202731; --bit-clr-bg-dis: #222; --bit-clr-bg-overlay: rgba(255, 255, 255, 0.2); //borders diff --git a/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scss b/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scss index b3eee08155..a3ee3031de 100644 --- a/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scss +++ b/src/BlazorUI/Bit.BlazorUI/Styles/Fluent/colors.fluent-light.scss @@ -98,9 +98,6 @@ --bit-clr-fg-sec: #5A5A5A; --bit-clr-fg-sec-hover: #444; --bit-clr-fg-sec-active: #333; - --bit-clr-fg-ter: #5A5A5A; - --bit-clr-fg-ter-hover: #444; - --bit-clr-fg-ter-active: #333; --bit-clr-fg-dis: #AAA; //backgrounds --bit-clr-bg-pri: #FFF; @@ -109,9 +106,6 @@ --bit-clr-bg-sec: #FAF9F8; --bit-clr-bg-sec-hover: #DDD; --bit-clr-bg-sec-active: #CCC; - --bit-clr-bg-ter: #FAF9F8; - --bit-clr-bg-ter-hover: #DDD; - --bit-clr-bg-ter-active: #CCC; --bit-clr-bg-dis: #F3F2F1; --bit-clr-bg-overlay: rgba(0, 0, 0, 0.4); //borders diff --git a/src/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scss b/src/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scss index cdcf0f3488..94dbf4b5d8 100644 --- a/src/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scss +++ b/src/BlazorUI/Bit.BlazorUI/Styles/theme-variables.scss @@ -102,9 +102,6 @@ $clr-fg-pri-active: var(--bit-clr-fg-pri-active); $clr-fg-sec: var(--bit-clr-fg-sec); $clr-fg-sec-hover: var(--bit-clr-fg-sec-hover); $clr-fg-sec-active: var(--bit-clr-fg-sec-active); -$clr-fg-ter: var(--bit-clr-fg-ter); -$clr-fg-ter-hover: var(--bit-clr-fg-ter-hover); -$clr-fg-ter-active: var(--bit-clr-fg-ter-active); $clr-fg-dis: var(--bit-clr-fg-dis); //backgrounds @@ -114,9 +111,6 @@ $clr-bg-pri-active: var(--bit-clr-bg-pri-active); $clr-bg-sec: var(--bit-clr-bg-sec); $clr-bg-sec-hover: var(--bit-clr-bg-sec-hover); $clr-bg-sec-active: var(--bit-clr-bg-sec-active); -$clr-bg-ter: var(--bit-clr-bg-ter); -$clr-bg-ter-hover: var(--bit-clr-bg-ter-hover); -$clr-bg-ter-active: var(--bit-clr-bg-ter-active); $clr-bg-dis: var(--bit-clr-bg-dis); $clr-bg-overlay: var(--bit-clr-bg-overlay); diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitButtonDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitButtonDemo.razor index 791663af24..0a940b3268 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitButtonDemo.razor +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitButtonDemo.razor @@ -339,100 +339,94 @@ Primary

+
+ Primary + Primary + Primary +
+

Secondary Secondary Secondary

+
+ Secondary + Secondary + Secondary +
+

Tertiary Tertiary Tertiary

+
+ Tertiary + Tertiary + Tertiary +
+
Info Info Info

+
+ Info + Info + Info +
+

Success Success Success

+
+ Success + Success + Success +
+

Warning Warning Warning

+
+ Warning + Warning + Warning +
+

SevereWarning SevereWarning SevereWarning

+
+ SevereWarning + SevereWarning + SevereWarning +
+

Error Error Error

-
-
- PrimaryBackground - PrimaryBackground - PrimaryBackground -
-
-
- SecondaryBackground - SecondaryBackground - SecondaryBackground -
-
-
- TertiaryBackground - TertiaryBackground - TertiaryBackground -
-
-
-
-
- PrimaryForeground - PrimaryForeground - PrimaryForeground -
-
-
- SecondaryForeground - SecondaryForeground - SecondaryForeground -
-
-
- TertiaryForeground - TertiaryForeground - TertiaryForeground -
-
-
-
-
- PrimaryBorder - PrimaryBorder - PrimaryBorder -
-
-
- SecondaryBorder - SecondaryBorder - SecondaryBorder -
+
+ Error + Error + Error
From 38fdc4f1c391ab9bd4a8ead62008ff90d4d3b284 Mon Sep 17 00:00:00 2001 From: Saleh Yusefnejad Date: Thu, 29 Aug 2024 09:26:04 +0330 Subject: [PATCH 04/34] initial identityheader --- .../Layout/Identity/IdentityHeader.razor | 16 +++++ .../Layout/Identity/IdentityHeader.razor.cs | 58 ++++++++++++++++++- .../Layout/Identity/IdentityLayout.razor | 4 +- 3 files changed, 74 insertions(+), 4 deletions(-) diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor index e69de29bb2..755f5fdc72 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor @@ -0,0 +1,16 @@ +@inherits AppComponentBase + + + + + Back to home + + + + + + + diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.cs index 0a8db9f087..70f204c6b0 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.cs +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.cs @@ -1,5 +1,59 @@ -namespace Boilerplate.Client.Core.Components.Layout.Identity; +using Bit.BlazorUI; +using Boilerplate.Client.Core.Services.Contracts; +using Boilerplate.Client.Core.Services; +using Boilerplate.Shared.Services; -public partial class IdentityHeader +namespace Boilerplate.Client.Core.Components.Layout.Identity; + +public partial class IdentityHeader : AppComponentBase { + [AutoInject] private Cookie cookie = default!; + [AutoInject] private IPubSubService pubSubService = default!; + [AutoInject] private BitThemeManager bitThemeManager = default!; + [AutoInject] private CultureInfoManager cultureInfoManager = default!; + [AutoInject] private IBitDeviceCoordinator bitDeviceCoordinator = default!; + + private string? SelectedCulture; + private BitDropdownItem[] cultures = default!; + + protected override async Task OnInitAsync() + { + if (CultureInfoManager.MultilingualEnabled) + { + cultures = CultureInfoManager.SupportedCultures + .Select(sc => new BitDropdownItem { Value = sc.Culture.Name, Text = sc.DisplayName }) + .ToArray(); + + SelectedCulture = CultureInfo.CurrentUICulture.Name; + } + + await base.OnInitAsync(); + } + + private async Task OnCultureChanged() + { + if (AppPlatform.IsBlazorHybrid) + { + await StorageService.SetItem("Culture", SelectedCulture, persistent: true); + cultureInfoManager.SetCurrentCulture(SelectedCulture!); + pubSubService.Publish(PubSubMessages.CULTURE_CHANGED, SelectedCulture); + } + else + { + await cookie.Set(new() + { + Name = ".AspNetCore.Culture", + Value = Uri.EscapeDataString($"c={SelectedCulture}|uic={SelectedCulture}"), + MaxAge = 30 * 24 * 3600, + Secure = AppEnvironment.IsDev() is false + }); + } + + NavigationManager.NavigateTo(NavigationManager.GetUriWithoutQueryParameter("culture"), forceLoad: true, replace: true); + } + + private async Task ToggleTheme() + { + await bitDeviceCoordinator.ApplyTheme(await bitThemeManager.ToggleDarkLightAsync() == "dark"); + } } diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor index e3119fe514..9fb21e0b3c 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor @@ -1,8 +1,8 @@ @inherits LayoutComponentBase -
+ @Body -
+ From 5e00954e5a7947d463dbfe5e82446389310cdca8 Mon Sep 17 00:00:00 2001 From: Saleh Yusefnejad Date: Thu, 29 Aug 2024 12:20:10 +0330 Subject: [PATCH 05/34] add header element --- .../Layout/Identity/IdentityHeader.razor | 26 ++++++++++--------- .../Layout/Identity/IdentityHeader.razor.scss | 4 +++ 2 files changed, 18 insertions(+), 12 deletions(-) diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor index 755f5fdc72..1fbb0d56ae 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor @@ -1,16 +1,18 @@ @inherits AppComponentBase - - - - Back to home - +
+ + + + Back to home + - + - - - + + + +
\ No newline at end of file diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.scss b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.scss index e69de29bb2..ca40ee720b 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.scss +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor.scss @@ -0,0 +1,4 @@ +header { + width: 100%; + position: absolute; +} From e4745cebc42b7af69a132809a73baa0f889adc03 Mon Sep 17 00:00:00 2001 From: Saleh Yusefnejad Date: Fri, 30 Aug 2024 19:42:46 +0330 Subject: [PATCH 06/34] remove redundant codes --- .../Layout/Identity/IdentityHeader.razor | 6 +- .../Layout/Identity/IdentityLayout.razor | 9 +- .../Layout/Identity/IdentityLayout.razor.scss | 141 +----------------- .../Components/Layout/LoadingComponent.razor | 9 +- .../Components/Layout/MainLayout.razor | 13 -- .../Components/Layout/MainLayout.razor.scss | 48 +----- 6 files changed, 28 insertions(+), 198 deletions(-) diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor index 1fbb0d56ae..d0b55e36ce 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityHeader.razor @@ -3,8 +3,10 @@
- - Back to home + + + Back to home + diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor index 9fb21e0b3c..3267538e26 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor @@ -3,6 +3,13 @@ - @Body + +
+ @Body +
+ + diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor.scss b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor.scss index 7454fe0263..bc5c414c49 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor.scss +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/Identity/IdentityLayout.razor.scss @@ -3,146 +3,11 @@ @import '../../../Styles/abstracts/_media-queries.scss'; @import '../../../Styles/abstracts/_bit-css-variables.scss'; -.layout { - width: 100%; - height: 100%; -} - main { - width: 100%; - display: flex; - min-height: 100vh; - position: relative; - box-sizing: border-box; - justify-content: flex-start; - padding-bottom: $footerHeight; - background-color: $bit-color-background-primary; - padding-top: calc($headerHeight + var(--bit-status-bar-height)); - - .bit-ios & { - padding-top: calc($headerHeight + env(safe-area-inset-top)); - padding-bottom: calc($footerHeight + env(safe-area-inset-bottom)); - } -} - -.main-content { - flex-grow: 1; - display: flex; - padding: 1rem; - min-height: 100%; - flex-flow: column; - align-items: center; - justify-content: center; - width: calc(100% - $navMenuWidth); + width: rem2(560px); background-color: $bit-color-background-secondary; - - @include lt-lg { - width: 100%; - } -} - -.status-bar { - top: 0; - width: 100%; - z-index: 101; - display: none; - position: fixed; - overflow: hidden; - text-align: center; - align-items: center; - font-size: rem2(14px); - justify-content: center; - background-color: transparent; - - .bit-ios & { - display: flex; - color: transparent; - height: env(safe-area-inset-top); - } - - .bit-windows &, .bit-macos & { - display: flex; - height: var(--bit-status-bar-height); - } -} - -::deep { - .form { - width: 100%; - display: flex; - position: relative; - text-align: center; - align-items: center; - max-width: rem2(504px); - justify-content: center; - flex-flow: column nowrap; - border-radius: rem2(4px); - padding: rem2(48px) rem2(16px); - box-shadow: $bit-box-shadow-callout; - background-color: $bit-color-background-primary; - } - - .form-title { - font-weight: 600; - font-size: rem2(28px); - line-height: rem2(44px); - margin-bottom: rem2(25px); - - @include lg { - font-size: rem2(24px); - line-height: rem2(36px); - } - - @include md { - font-size: rem2(22px); - line-height: rem2(36px); - } - - @include sm { - font-size: rem2(20px); - line-height: rem2(32px); - } - } - - .form-input-container { - width: 100%; - display: flex; - text-align: start; - max-width: rem2(300px); - flex-flow: column nowrap; - margin-bottom: rem2(21px); - } - - .form-input-error, - .validation-message { - text-align: start; - font-size: rem2(12px); - line-height: rem2(16px); - color: $bit-color-error; - } - - .form-submit-button { - margin-top: rem2(20px); - margin-bottom: rem2(10px); - } - - .form-message-bar { - width: 100%; - position: absolute; - text-align: center; - inset-block-start: 0; - inset-inline-start: 0; - border-radius: rem2(4px) rem2(4px) 0 0; - scroll-margin-top: calc($headerHeight + var(--bit-status-bar-height) + 1px); - } } -.bit-ios { - ::deep .form-message-bar { - scroll-margin-top: calc($headerHeight + env(safe-area-inset-top) + 1px); - } -} - -::deep .loading-container { - text-align: center; +aside { + flex-grow: 1; } diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/LoadingComponent.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/LoadingComponent.razor index 3d77d75ff4..22c2d90d6a 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/LoadingComponent.razor +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/LoadingComponent.razor @@ -1,15 +1,16 @@