From 1ed8c3e1aca749460dd8a412582b34525b70f9cf Mon Sep 17 00:00:00 2001
From: zzlgreat <zzlgreat@gmail.com>
Date: Wed, 24 Dec 2025 13:13:20 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0Company=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E7=9A=84UI=E4=B8=BAFUI=E9=A3=8E=E6=A0=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/DynamicNews/EventScrollList.js |   2 +-
 .../layouts/MainlineTimelineView.js           | 118 ++++++++----------
 2 files changed, 55 insertions(+), 65 deletions(-)

diff --git a/src/views/Community/components/DynamicNews/EventScrollList.js b/src/views/Community/components/DynamicNews/EventScrollList.js
index 6d64cf5c..df0b1ab6 100644
--- a/src/views/Community/components/DynamicNews/EventScrollList.js
+++ b/src/views/Community/components/DynamicNews/EventScrollList.js
@@ -62,7 +62,7 @@ const EventScrollList = React.memo(
     return (
       <Box
         ref={scrollContainerRef}
-        overflow="hidden"
+        overflow={mode === "mainline" ? "visible" : "hidden"}
         h="100%"
         pt={0}
         pb={mode === "mainline" ? 0 : 4}
diff --git a/src/views/Community/components/DynamicNews/layouts/MainlineTimelineView.js b/src/views/Community/components/DynamicNews/layouts/MainlineTimelineView.js
index ac1c2629..5f961ffd 100644
--- a/src/views/Community/components/DynamicNews/layouts/MainlineTimelineView.js
+++ b/src/views/Community/components/DynamicNews/layouts/MainlineTimelineView.js
@@ -295,7 +295,8 @@ const MainlineCard = React.memo(
         borderTopColor={`${colorScheme}.500`}
         minW={isExpanded ? "320px" : "280px"}
         maxW={isExpanded ? "380px" : "320px"}
-        h="100%"
+        minH="500px"
+        maxH="600px"
         display="flex"
         flexDirection="column"
         transition="all 0.3s ease"
@@ -785,10 +786,30 @@ const MainlineTimelineViewComponent = forwardRef(
     return (
       <Box
         display={display}
-        h="100%"
+        minH="600px"
+        h="auto"
         w="100%"
         bg={COLORS.containerBg}
-        overflow="hidden"
+        overflowY="visible"
+        overflowX="auto"
+        css={{
+          "&::-webkit-scrollbar": {
+            height: "12px",
+            background: COLORS.scrollbarTrackBg,
+          },
+          "&::-webkit-scrollbar-track": {
+            background: COLORS.scrollbarTrackBg,
+            borderRadius: "6px",
+          },
+          "&::-webkit-scrollbar-thumb": {
+            background: `linear-gradient(90deg, ${COLORS.scrollbarThumbBg}, #8a9bb0)`,
+            borderRadius: "6px",
+            border: `2px solid ${COLORS.scrollbarTrackBg}`,
+          },
+          "&::-webkit-scrollbar-thumb:hover": {
+            background: `linear-gradient(90deg, ${COLORS.scrollbarThumbHoverBg}, #b8c5d4)`,
+          },
+        }}
       >
         {/* 顶部统计栏 */}
         <Flex
@@ -935,68 +956,37 @@ const MainlineTimelineViewComponent = forwardRef(
           </HStack>
         </Flex>
 
-        {/* 主线卡片横向滚动容器 - 使用 column-reverse 让滚动条在顶部 */}
-        <Box
-          h="calc(100% - 44px)"
-          display="flex"
-          flexDirection="column-reverse"
+        {/* 主线卡片横向排列容器 */}
+        <HStack
+          spacing={3}
+          p={3}
+          align="stretch"
+          minW="max-content"
         >
-          <Box
-            flex="1"
-            overflowX="auto"
-            overflowY="hidden"
-            css={{
-              "&::-webkit-scrollbar": {
-                height: "12px",
-                background: COLORS.scrollbarTrackBg,
-              },
-              "&::-webkit-scrollbar-track": {
-                background: COLORS.scrollbarTrackBg,
-                borderRadius: "6px",
-              },
-              "&::-webkit-scrollbar-thumb": {
-                background: `linear-gradient(90deg, ${COLORS.scrollbarThumbBg}, #8a9bb0)`,
-                borderRadius: "6px",
-                border: `2px solid ${COLORS.scrollbarTrackBg}`,
-              },
-              "&::-webkit-scrollbar-thumb:hover": {
-                background: `linear-gradient(90deg, ${COLORS.scrollbarThumbHoverBg}, #b8c5d4)`,
-              },
-            }}
-          >
-          <HStack
-            spacing={3}
-            p={3}
-            align="stretch"
-            h="100%"
-            minW="max-content"
-          >
-            {mainlines.map((mainline) => {
-              const groupId =
-                mainline.group_id ||
-                mainline.lv2_id ||
-                mainline.lv1_id ||
-                "ungrouped";
-              const groupName =
-                mainline.group_name ||
-                mainline.lv2_name ||
-                mainline.lv1_name ||
-                "其他";
-              return (
-                <MainlineCard
-                  key={groupId}
-                  mainline={mainline}
-                  colorScheme={getColorScheme(groupName)}
-                  isExpanded={expandedGroups[groupId]}
-                  onToggle={() => toggleGroup(groupId)}
-                  selectedEvent={selectedEvent}
-                  onEventSelect={onEventSelect}
-                />
-              );
-            })}
-          </HStack>
-          </Box>
-        </Box>
+          {mainlines.map((mainline) => {
+            const groupId =
+              mainline.group_id ||
+              mainline.lv2_id ||
+              mainline.lv1_id ||
+              "ungrouped";
+            const groupName =
+              mainline.group_name ||
+              mainline.lv2_name ||
+              mainline.lv1_name ||
+              "其他";
+            return (
+              <MainlineCard
+                key={groupId}
+                mainline={mainline}
+                colorScheme={getColorScheme(groupName)}
+                isExpanded={expandedGroups[groupId]}
+                onToggle={() => toggleGroup(groupId)}
+                selectedEvent={selectedEvent}
+                onEventSelect={onEventSelect}
+              />
+            );
+          })}
+        </HStack>
       </Box>
     );
   }