refactor(video-rendering): consolidate video and shorts rendering logic

Move shorts rendering into renderVideos function for better code organization
Update video grid layout and styling for improved responsiveness

js/script.js

@@ -511,7 +511,6 @@ const subscriptionsList = document.querySelector('.subscriptions-list');
 async function init() {
     await loadVideos();
     renderVideos();
-    renderShorts();
     renderSubscriptions();
     bindEvents();
 }
@@ -522,27 +521,22 @@ async function loadVideos() {
 
 function renderVideos() {
     const filteredVideos = filterVideosByCategory(currentCategory);
+    const videosOnly = filteredVideos.filter(video => video.type === 'video');
+    const shortsOnly = filteredVideos.filter(video => video.type === 'short');
     
     videoGrid.innerHTML = '';
-    
-    filteredVideos.forEach(video => {
-        if (video.type === 'video') {
-            const videoCard = createVideoCard(video);
-            videoGrid.appendChild(videoCard);
-        }
-    });
-}
-
-function renderShorts() {
-    const filteredVideos = filterVideosByCategory(currentCategory);
-    
     shortsGrid.innerHTML = '';
     
-    filteredVideos.forEach(video => {
-        if (video.type === 'short') {
-            const shortsCard = createShortsCard(video);
-            shortsGrid.appendChild(shortsCard);
-        }
+    // 渲染长视频
+    videosOnly.forEach(video => {
+        const videoCard = createVideoCard(video);
+        videoGrid.appendChild(videoCard);
+    });
+    
+    // 渲染短视频
+    shortsOnly.forEach(video => {
+        const shortsCard = createShortsCard(video);
+        shortsGrid.appendChild(shortsCard);
     });
 }
 
@@ -778,7 +772,6 @@ function bindEvents() { // Bind events to the DOM elements
             currentCategory = btn.textContent;
             // Re-render videos and shorts
             renderVideos();
-            renderShorts();
         });
     });