style: Layout 组件支持 dark 模式

Author: ArgoZhang

src/BootstrapBlazor/Components/Layout/Layout.razor.scss

@@ -7,6 +7,8 @@
     --bb-layout-menu-item-hover-bg: #{$bb-layout-menu-item-hover-bg-dark};
     --bb-layout-menu-user-banner-background: #{$bb-layout-menu-user-banner-background-dark};
     --bb-layout-menu-user-border-color: #{$bb-layout-menu-user-border-color-dark};
+    --bb-layout-logo-border-color: #{$bb-layout-logo-border-color-dark};
+    --bb-layout-logo-bg: #{$bb-layout-logo-bg-dark};
 }
 
 .layout {
@@ -30,6 +32,8 @@
     --bb-layout-title-margin-left: #{$bb-layout-title-margin-left};
     --bb-layout-banner-font-size: #{$bb-layout-banner-font-size};
     --bb-layout-banner-logo-width: #{$bb-layout-banner-logo-width};
+    --bb-layout-logo-border-color: #{$bb-layout-logo-border-color};
+    --bb-layout-logo-bg: #{$bb-layout-logo-bg};
     --bb-layout-banner-border-color: #{$bb-layout-banner-border-color};
     --bb-layout-menu-user-banner-background: #{$bb-layout-menu-user-banner-background};
     --bb-layout-menu-user-border-color: #{$bb-layout-menu-user-border-color};
@@ -73,6 +77,8 @@
                 .layout-logo {
                     width: var(--bb-layout-banner-logo-width);
                     border-radius: var(--bs-border-radius);
+                    background-color: var(--bb-layout-logo-bg);
+                    border: 1px solid var(--bb-layout-logo-border-color);
 
                     + .layout-title {
                         margin-left: var(--bb-layout-title-margin-left);

src/BootstrapBlazor/wwwroot/scss/bootstrapblazor-dark.scss

@@ -7,6 +7,8 @@ $bb-layout-headerbar-background-dark: #606266;
 $bb-layout-menu-item-hover-bg-dark: #606266;
 $bb-layout-menu-user-banner-background-dark: #2c3034;
 $bb-layout-menu-user-border-color-dark: #2c3034;
+$bb-layout-logo-border-color-dark: var(--bs-border-color);
+$bb-layout-logo-bg-dark: #606266;
 
 // Dial-Button
 $bb-dial-item-hover-bg-dark: #313131;

src/BootstrapBlazor/wwwroot/scss/theme/bootstrapblazor.scss

@@ -343,6 +343,8 @@ $bb-layout-banner-border-color: #0078d4;
 $bb-layout-menu-user-banner-background: #0078d4;
 $bb-layout-menu-user-border-color: #0069b9;
 $bb-layout-menu-item-hover-bg: #409eff;
+$bb-layout-logo-border-color: #d5d5d5;
+$bb-layout-logo-bg: #0e77e3;
 
 // Light
 $bb-light-bg: radial-gradient(circle, #fff, #aaa, #333);