refactor: 调整结构精简样式

Author: ArgoZhang

src/BootstrapBlazor/Components/IntersectionObserver/LoadMore.razor

@@ -3,26 +3,26 @@
 
 <IntersectionObserver OnIntersecting="OnIntersecting" Threshold="1" AutoUnobserveWhenIntersection="false">
     <IntersectionObserverItem>
-        @if (CanLoading)
-        {
-            if (LoadingTemplate != null)
+        <div class="bb-intersection-loading">
+            @if (CanLoading)
             {
-                @LoadingTemplate
+                if (LoadingTemplate != null)
+                {
+                    @LoadingTemplate
+                }
+                else
+                {
+                    <Spinner></Spinner>
+                }
             }
-            else
+            else if (NoMoreTemplate != null)
             {
-                <div class="bb-intersection-loading">
-                    <Spinner></Spinner>
-                </div>
+                @NoMoreTemplate
+            }
+            else if (!string.IsNullOrEmpty(NoMoreText))
+            {
+                @NoMoreText
             }
-        }
-        else if (NoMoreTemplate != null)
-        {
-            @NoMoreTemplate
-        }
-        else if (!string.IsNullOrEmpty(NoMoreText))
-        {
-            <div class="bb-intersection-stop-text">@NoMoreText</div>
-        }
+        </div>
     </IntersectionObserverItem>
 </IntersectionObserver>

src/BootstrapBlazor/Components/IntersectionObserver/LoadMore.razor.scss

@@ -1,14 +1,14 @@
-.bb-intersection-loading {
-    display: flex;
-    justify-content: center;
-    padding: .5rem .5rem 1rem;
-    color: #aaa;
-}
+.bb-intersection-observer {
+    --bb-intersection-observer-loading-bg: #{$bb-intersection-observer-loading-bg};
+    --bb-intersection-observer-loading-color: #{$bb-intersection-observer-loading-color};
+    --bb-intersection-observer-loading-padding: #{$bb-intersection-observer-loading-padding};
 
-.bb-intersection-stop-text {
-    display: flex;
-    justify-content: center;
-    padding: .5rem .5rem 1rem;
-    color: #aaa;
-    font-size: .875rem;
+    .bb-intersection-loading {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        background-color: var(--bb-intersection-observer-loading-bg);
+        color: var(--bb-intersection-observer-loading-color);
+        padding: var(--bb-intersection-observer-loading-padding)
+    }
 }

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

@@ -311,6 +311,11 @@ $bb-svg-icon-width: 12px;
 $bb-viewer-button-bg: #606266;
 $bb-viewer-border-radius: 50%;
 
+// IntersectionObserver
+$bb-intersection-observer-loading-bg: var(--bs-body-bg);
+$bb-intersection-observer-loading-color: var(--bs-body-color);
+$bb-intersection-observer-loading-padding: 0.5rem;
+
 // Ip Address
 $bb-ip-cell-max-width: 30px;