滚动条样式更新

src/views/Community/components/DynamicNews/DynamicNewsCard.js

@@ -638,8 +638,8 @@ const [currentMode, setCurrentMode] = useState('vertical');
         overflow="visible"
         zIndex={1}
       >
-        {/* 内容区域 - 撑满剩余高度 */}
-        <Box flex="1" minH={0} position="relative">
+        {/* 内容区域 */}
+        <Box position="relative">
           {/* Loading 蒙层 - 数据请求时显示 */}
           {loading && (
             <Box

src/views/Community/components/DynamicNews/layouts/MainlineTimelineView.js

@@ -936,12 +936,13 @@ const MainlineTimelineViewComponent = forwardRef(
 
         {/* 横向滚动容器 - 滚动条在卡片上方 */}
         <Box
-          overflowX="auto"
+          overflowX="scroll"
           overflowY="visible"
           pb={2}
-          css={{
+          sx={{
             "&::-webkit-scrollbar": {
               height: "10px",
+              display: "block",
             },
             "&::-webkit-scrollbar-track": {
               background: COLORS.scrollbarTrackBg,
@@ -950,10 +951,13 @@ const MainlineTimelineViewComponent = forwardRef(
             "&::-webkit-scrollbar-thumb": {
               background: COLORS.scrollbarThumbBg,
               borderRadius: "5px",
+              minWidth: "40px",
             },
             "&::-webkit-scrollbar-thumb:hover": {
               background: COLORS.scrollbarThumbHoverBg,
             },
+            scrollbarWidth: "thin",
+            scrollbarColor: `${COLORS.scrollbarThumbBg} ${COLORS.scrollbarTrackBg}`,
           }}
         >
           {/* 主线卡片横向排列容器 */}
@@ -962,7 +966,8 @@ const MainlineTimelineViewComponent = forwardRef(
             p={3}
             pt={1}
             align="stretch"
-            w="max-content"
+            display="inline-flex"
+            minW="max-content"
           >
             {mainlines.map((mainline) => {
               const groupId =