refactor(Scroll): support dark theme (#2644)

* refactor: 精简代码

* chore: 更新字典

* doc: 更新示例

* chore: 引入 dark 文件

* refactor: 增加 dark 样式

exclusion.dic

@@ -40,6 +40,7 @@ Func
 Prev
 Textarea
 rendermode
+Motronic
 motronic
 webassembly
 netcore

src/BootstrapBlazor.Server/Components/Samples/Scrolls.razor

@@ -8,7 +8,7 @@
 <p>@((MarkupString)Localizer["ScrollTips"].Value)</p>
 
 <DemoBlock Title="@Localizer["ScrollNormalTitle"]" Introduction="@Localizer["ScrollNormalIntro"]" Name="Normal">
-    <div class="scroll-demo">
+    <div class="scroll-demo border">
         <Scroll Height="200px">
             <div style="height: 400px;">@Localizer["ScrollNormalDescription"]</div>
             <div>@Localizer["ScrollNormalBottom"]</div>

src/BootstrapBlazor.Server/Components/Samples/Scrolls.razor.css

@@ -1,5 +1,4 @@
 .scroll-demo {
-    border: solid 1px var(--bs-secondary);
     padding: .5rem;
     border-radius: var(--bs-border-radius);
 }

src/BootstrapBlazor/Components/Scroll/Scroll.razor.scss

@@ -24,6 +24,11 @@
     }
 }
 
+[data-bs-theme='dark'] .scroll {
+    --bb-scorll-thumb-bg: #{$bb-scorll-thumb-bg-dark};
+    --bb-scorll-thumb-hover-bg: #{$bb-scorll-thumb-hover-bg-dark};
+}
+
 @media (min-width: 992px) {
     .scroll {
         overflow: hidden;

src/BootstrapBlazor/Options/BootstrapBlazorOptions.cs

@@ -87,16 +87,16 @@ public class BootstrapBlazorOptions
     /// <summary>
     /// 获得/设置 网站主题集合
     /// </summary>
-    public List<KeyValuePair<string, string>> Themes { get; } = new()
-    {
+    public List<KeyValuePair<string, string>> Themes { get; } =
+    [
         new("Bootstrap", "bootstrap.blazor.bundle.min.css"),
         new("Motronic", "motronic.min.css")
-    };
+    ];
 
     /// <summary>
     /// 获得支持多语言集合
     /// </summary>
     /// <returns></returns>
     public IList<CultureInfo> GetSupportedCultures() => SupportedCultures?.Select(name => new CultureInfo(name)).ToList()
-        ?? new List<CultureInfo> { new("en"), new("zh") };
+        ?? [new("en"), new("zh")];
 }

src/BootstrapBlazor/wwwroot/scss/bootstrap.blazor-dark.scss

@@ -0,0 +1,3 @@
+// Scroll
+$bb-scorll-thumb-bg-dark: rgba(255,255,255,0.2);
+$bb-scorll-thumb-hover-bg-dark: rgba(255,255,255,0.3);

src/BootstrapBlazor/wwwroot/scss/components.scss

@@ -1,3 +1,5 @@
+@import "bootstrap.blazor-dark.scss";
+
 @import "root.scss";
 @import "../../Components/Alert/Alert.razor.scss";
 @import "../../Components/AnchorLink/AnchorLink.razor.scss";

src/BootstrapBlazor/wwwroot/scss/theme/bootstrap.blazor.scss

@@ -626,5 +626,4 @@ $bb-upload-card-item-width: 168px;
 // ValidateForm
 $bb-form-control-padding: 0.375rem 0.75rem;
 
-
 @import "../components.scss";