From badc5865f43eb6b4a0a101fe92b56b935a6a2909 Mon Sep 17 00:00:00 2001
From: zzlgreat <zzlgreat@gmail.com>
Date: Wed, 24 Dec 2025 13:26:12 +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/DynamicNewsCard.js | 21 +----
 .../components/DynamicNews/EventScrollList.js |  2 +-
 .../layouts/MainlineTimelineView.js           | 87 ++++++++++++-------
 3 files changed, 57 insertions(+), 53 deletions(-)

diff --git a/src/views/Community/components/DynamicNews/DynamicNewsCard.js b/src/views/Community/components/DynamicNews/DynamicNewsCard.js
index 624e5d8c..5042088b 100644
--- a/src/views/Community/components/DynamicNews/DynamicNewsCard.js
+++ b/src/views/Community/components/DynamicNews/DynamicNewsCard.js
@@ -635,27 +635,8 @@ const [currentMode, setCurrentMode] = useState('vertical');
         mx={0}
         display="flex"
         flexDirection="column"
-        overflowX={mode === 'mainline' ? 'auto' : 'visible'}
-        overflowY="visible"
+        overflow="visible"
         zIndex={1}
-        css={mode === 'mainline' ? {
-          "&::-webkit-scrollbar": {
-            height: "10px",
-            background: "#2d3748",
-          },
-          "&::-webkit-scrollbar-track": {
-            background: "#2d3748",
-            borderRadius: "5px",
-          },
-          "&::-webkit-scrollbar-thumb": {
-            background: "linear-gradient(90deg, #718096, #8a9bb0)",
-            borderRadius: "5px",
-            border: "2px solid #2d3748",
-          },
-          "&::-webkit-scrollbar-thumb:hover": {
-            background: "linear-gradient(90deg, #a0aec0, #b8c5d4)",
-          },
-        } : undefined}
       >
         {/* 内容区域 - 撑满剩余高度 */}
         <Box flex="1" minH={0} position="relative">
diff --git a/src/views/Community/components/DynamicNews/EventScrollList.js b/src/views/Community/components/DynamicNews/EventScrollList.js
index df0b1ab6..062cd4f1 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={mode === "mainline" ? "visible" : "hidden"}
+        overflow="visible"
         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 ffecb81f..ef5a355f 100644
--- a/src/views/Community/components/DynamicNews/layouts/MainlineTimelineView.js
+++ b/src/views/Community/components/DynamicNews/layouts/MainlineTimelineView.js
@@ -784,8 +784,7 @@ const MainlineTimelineViewComponent = forwardRef(
     return (
       <Box
         display={display}
-        w="max-content"
-        minW="100%"
+        w="100%"
         bg={COLORS.containerBg}
       >
         {/* 顶部统计栏 - 固定不滚动 */}
@@ -935,37 +934,61 @@ const MainlineTimelineViewComponent = forwardRef(
           </HStack>
         </Flex>
 
-        {/* 主线卡片横向排列容器 */}
-        <HStack
-          spacing={3}
-          p={3}
-          align="stretch"
-          w="max-content"
+        {/* 横向滚动容器 - 滚动条在卡片上方 */}
+        <Box
+          overflowX="auto"
+          overflowY="visible"
+          pb={2}
+          css={{
+            "&::-webkit-scrollbar": {
+              height: "10px",
+            },
+            "&::-webkit-scrollbar-track": {
+              background: COLORS.scrollbarTrackBg,
+              borderRadius: "5px",
+            },
+            "&::-webkit-scrollbar-thumb": {
+              background: COLORS.scrollbarThumbBg,
+              borderRadius: "5px",
+            },
+            "&::-webkit-scrollbar-thumb:hover": {
+              background: COLORS.scrollbarThumbHoverBg,
+            },
+          }}
         >
-          {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>
+          {/* 主线卡片横向排列容器 */}
+          <HStack
+            spacing={3}
+            p={3}
+            pt={1}
+            align="stretch"
+            w="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>
     );
   }