Enhance infinite scroll functionality; increase sentinel height and ensure full width, trigger layout recalculation on initialization. Try to fix: https://github.com/willmiao/ComfyUI-Lora-Manager/issues/24

static/js/utils/infiniteScroll.js

@@ -22,8 +22,15 @@ export function initializeInfiniteScroll() {
     } else {
         const sentinel = document.createElement('div');
         sentinel.id = 'scroll-sentinel';
-        sentinel.style.height = '10px';
+        sentinel.style.height = '20px'; // Increase height a bit
+        sentinel.style.width = '100%';  // Ensure full width
+        sentinel.style.position = 'relative'; // Ensure it's in the normal flow
         document.getElementById('loraGrid').appendChild(sentinel);
         state.observer.observe(sentinel);
     }
-} 
+
+    // Force layout recalculation
+    setTimeout(() => {
+        window.dispatchEvent(new Event('resize'));
+    }, 100);
+}

templates/loras.html

@@ -85,7 +85,7 @@
         {% else %}
             {% include 'components/controls.html' %}
             <!-- Lora卡片容器 -->
-            <div class="card-grid" id="loraGrid">
+            <div class="card-grid" id="loraGrid" style="height: calc(100vh - [header-height]px); overflow-y: auto;">
                 <!-- Cards will be dynamically inserted here -->
             </div>
         {% endif %}