doc(GlobalSearch): update component css (#6852)

* refactor: 移除 meilisearch 样式

* chore(CssBundler): bump version 1.0.1

* refactor: 更新 header 样式

* refactor: 更新依赖包版本

* refactor: 更新搜索栏样式

Author: ArgoZhang

src/BootstrapBlazor.Server/BootstrapBlazor.Server.csproj

@@ -53,7 +53,7 @@
     <PackageReference Include="BootstrapBlazor.Live2DDisplay" Version="9.0.1" />
     <PackageReference Include="BootstrapBlazor.Markdown" Version="9.0.2" />
     <PackageReference Include="BootstrapBlazor.MaterialDesign" Version="9.0.1" />
-    <PackageReference Include="BootstrapBlazor.MeiliSearch" Version="9.1.10" />
+    <PackageReference Include="BootstrapBlazor.MeiliSearch" Version="9.1.11" />
     <PackageReference Include="BootstrapBlazor.Mermaid" Version="9.0.4" />
     <PackageReference Include="BootstrapBlazor.Middleware" Version="9.0.0" />
     <PackageReference Include="BootstrapBlazor.MindMap" Version="9.1.6" />

src/BootstrapBlazor.Server/Components/Components/Header.razor.css

@@ -64,10 +64,26 @@
     }
 
 ::deep .bb-g-search {
+    --bs-border-color: var(--bb-header-dropdown-border-color);
+    --bb-border-hover-color: var(--bb-header-dropdown-border-hover-color);
     width: var(--bb-header-select-width);
-    margin-bottom: var(--bb-header-search-margin-bottom);
+    margin-block-end: var(--bb-header-search-margin-bottom);
+    color: var(--bb-header-dropdown-color);
+    font-size: 0.875rem;
 }
 
+    ::deep .bb-g-search .search-dialog-icon {
+        font-size: 0.875rem;
+    }
+
+    ::deep .bb-g-search > input {
+        padding: 2px 0;
+    }
+
+        ::deep .bb-g-search > input::placeholder {
+            color: var(--bb-header-dropdown-color);
+        }
+
 @media (min-width: 768px) {
     .navbar-header {
         position: sticky;
@@ -77,7 +93,7 @@
     }
 
     ::deep .bb-g-search {
-        margin-bottom: 0;
+        margin-block-end: 0;
         margin-inline-end: .5rem;
     }
 }

src/BootstrapBlazor/wwwroot/scss/components.scss

@@ -116,7 +116,6 @@
 @use "../../Components/Marquee/Marquee.razor.scss";
 @use "../../Components/Waterfall/Waterfall.razor.scss";
 @use "../../Components/Watermark/Watermark.razor.scss";
-@use "./meilisearch.scss";
 
 [dir="rtl"] .card-collapse-bar:not([aria-expanded=true]) > .card-collapse-arrow {
     transform: rotate(180deg);