From af3140a3357f685f60b367069006f7fab161e333 Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Thu, 12 Sep 2024 12:24:47 +0800
Subject: [PATCH] feat(Layout): support dark mode (#4286)

* feat: support dark mode

* chore: bump version 8.9.2-beta09
---
 src/BootstrapBlazor/BootstrapBlazor.csproj          |  2 +-
 .../Components/Layout/Layout.razor.scss             |  1 -
 .../wwwroot/scss/theme/bootstrapblazor.scss         | 13 ++++++-------
 3 files changed, 7 insertions(+), 9 deletions(-)

diff --git a/src/BootstrapBlazor/BootstrapBlazor.csproj b/src/BootstrapBlazor/BootstrapBlazor.csproj
index 9f687c0ba..f4f92dc8d 100644
--- a/src/BootstrapBlazor/BootstrapBlazor.csproj
+++ b/src/BootstrapBlazor/BootstrapBlazor.csproj
@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>8.9.2-beta08</Version>
+    <Version>8.9.2-beta09</Version>
   </PropertyGroup>
 
   <ItemGroup Condition="'$(TargetFramework)' == 'net5.0'">
diff --git a/src/BootstrapBlazor/Components/Layout/Layout.razor.scss b/src/BootstrapBlazor/Components/Layout/Layout.razor.scss
index 1d15c2e8b..3200ff554 100644
--- a/src/BootstrapBlazor/Components/Layout/Layout.razor.scss
+++ b/src/BootstrapBlazor/Components/Layout/Layout.razor.scss
@@ -10,7 +10,6 @@
     --bb-layout-sidebar-width: #{$bb-layout-sidebar-width};
     --bb-layout-sidebar-collapse-width: #{$bb-layout-sidebar-collapse-width};
     --bb-layout-sidebar-banner-background: #{$bb-layout-sidebar-banner-background};
-    --bb-layout-sidebar-scrollbar-background: #{$bb-layout-sidebar-scrollbar-background};
     --bb-layout-sidebar-background: #{$bb-layout-sidebar-background};
     --bb-layout-sidebar-color: #{$bb-layout-sidebar-color};
     --bb-layout-title-color: #{$bb-layout-title-color};
diff --git a/src/BootstrapBlazor/wwwroot/scss/theme/bootstrapblazor.scss b/src/BootstrapBlazor/wwwroot/scss/theme/bootstrapblazor.scss
index b375377a4..62878c44e 100644
--- a/src/BootstrapBlazor/wwwroot/scss/theme/bootstrapblazor.scss
+++ b/src/BootstrapBlazor/wwwroot/scss/theme/bootstrapblazor.scss
@@ -315,18 +315,17 @@ $bb-ip-cell-max-width: 30px;
 
 // Layout
 $bb-layout-header-height: 50px;
-$bb-layout-header-background: #f8f9fa;
+$bb-layout-header-background: var(--bs-body-bg);
 $bb-layout-header-color: var(--bs-body-color);
-$bb-layout-headerbar-background: #409eff;
-$bb-layout-headerbar-border-color: #409eff;
-$bb-layout-footer-background: #f8f9fa;
+$bb-layout-headerbar-background: var(--bs-body-bg);
+$bb-layout-headerbar-border-color: var(--bs-body-color);
+$bb-layout-footer-background: var(--bs-body-bg);
 $bb-layout-footer-color: var(--bs-body-color);
 $bb-layout-footer-height: 40px;
 $bb-layout-sidebar-width: 214px;
 $bb-layout-sidebar-collapse-width: 70px;
-$bb-layout-sidebar-banner-background: #f8f9fa;
-$bb-layout-sidebar-scrollbar-background: #c1c1c1;
-$bb-layout-sidebar-background: #f8f9fa;
+$bb-layout-sidebar-banner-background: var(--bs-body-bg);
+$bb-layout-sidebar-background: var(--bs-body-bg);
 $bb-layout-sidebar-color: var(--bs-body-color);
 $bb-layout-title-color: var(--bs-body-color);
 $bb-layout-title-margin-left: .5rem;