From fe004344549e0c2d078907c00da8556ae8483068 Mon Sep 17 00:00:00 2001
From: "Apple\\Apple" <zeraturing@foxmail.com>
Date: Tue, 10 Jun 2025 01:42:38 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20style:=20disable=20y-axis=20scro?=
 =?UTF-8?q?lling=20for=20semi-layout=20components?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Hide scrollbars for .semi-layout, .semi-layout-content, and .semi-sider
- Set scrollbar width and height to 0 for webkit browsers
- Add cross-browser scrollbar hiding support (webkit, firefox, IE/Edge)
- Change Content container overflow from 'auto' to 'hidden' on desktop
- Remove redundant scrollbar styling (thumb, hover, track styles)

This ensures that all semi-layout related components have no visible
scrollbars and prevents vertical scrolling functionality entirely.

Files modified:
- web/src/index.css
- web/src/components/layout/PageLayout.js
---
 web/src/components/layout/PageLayout.js |  2 +-
 web/src/index.css                       | 84 ++++---------------------
 2 files changed, 13 insertions(+), 73 deletions(-)

diff --git a/web/src/components/layout/PageLayout.js b/web/src/components/layout/PageLayout.js
index 8576a4ea..e25901ef 100644
--- a/web/src/components/layout/PageLayout.js
+++ b/web/src/components/layout/PageLayout.js
@@ -134,7 +134,7 @@ const PageLayout = () => {
           <Content
             style={{
               flex: '1 0 auto',
-              overflowY: styleState.isMobile ? 'visible' : 'auto',
+              overflowY: styleState.isMobile ? 'visible' : 'hidden',
               WebkitOverflowScrolling: 'touch',
               padding: shouldInnerPadding ? (styleState.isMobile ? '5px' : '24px') : '0',
               position: 'relative',
diff --git a/web/src/index.css b/web/src/index.css
index 4f02bf0f..a1c931fc 100644
--- a/web/src/index.css
+++ b/web/src/index.css
@@ -15,20 +15,9 @@
 
 /* ==================== 全局基础样式 ==================== */
 body {
-  margin: 0;
-  padding-top: 0;
-  font-family:
-    Lato, 'Helvetica Neue', Arial, Helvetica, 'Microsoft YaHei', sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  scrollbar-width: none;
-  color: var(--semi-color-text-0) !important;
-  background-color: var(--semi-color-bg-0) !important;
-  height: 100vh;
-}
-
-body::-webkit-scrollbar {
-  display: none;
+  font-family: Lato, 'Helvetica Neue', Arial, Helvetica, 'Microsoft YaHei', sans-serif;
+  color: var(--semi-color-text-0);
+  background-color: var(--semi-color-bg-0);
 }
 
 code {
@@ -36,34 +25,20 @@ code {
     source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
 }
 
-#root {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-}
-
 /* ==================== 布局相关样式 ==================== */
+.semi-layout::-webkit-scrollbar,
 .semi-layout-content::-webkit-scrollbar,
 .semi-sider::-webkit-scrollbar {
-  width: 6px;
-  height: 6px;
+  display: none;
+  width: 0;
+  height: 0;
 }
 
-.semi-layout-content::-webkit-scrollbar-thumb,
-.semi-sider::-webkit-scrollbar-thumb {
-  background: var(--semi-color-tertiary-light-default);
-  border-radius: 3px;
-}
-
-.semi-layout-content::-webkit-scrollbar-thumb:hover,
-.semi-sider::-webkit-scrollbar-thumb:hover {
-  background: var(--semi-color-tertiary);
-}
-
-.semi-layout-content::-webkit-scrollbar-track,
-.semi-sider::-webkit-scrollbar-track {
-  background: transparent;
+.semi-layout,
+.semi-layout-content,
+.semi-sider {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
 }
 
 /* ==================== 导航和侧边栏样式 ==================== */
@@ -438,41 +413,6 @@ code {
 
 /* ==================== 响应式/移动端样式 ==================== */
 @media only screen and (max-width: 767px) {
-  #root>section>header>section>div>div>div>div.semi-navigation-footer>div>a>li {
-    padding: 0 0;
-  }
-
-  #root>section>header>section>div>div>div>div.semi-navigation-header-list-outer>div.semi-navigation-list-wrapper>ul>div>a>li {
-    padding: 0 5px;
-  }
-
-  #root>section>header>section>div>div>div>div.semi-navigation-footer>div:nth-child(1)>a>li {
-    padding: 0 5px;
-  }
-
-  .semi-navigation-horizontal .semi-navigation-header {
-    margin-right: 0;
-  }
-
-  /* 确保移动端内容可滚动 */
-  .semi-layout-content {
-    -webkit-overflow-scrolling: touch !important;
-    overscroll-behavior-y: auto !important;
-  }
-
-  /* 修复移动端下拉刷新 */
-  body {
-    overflow: visible !important;
-    overscroll-behavior-y: auto !important;
-    position: static !important;
-    height: 100% !important;
-  }
-
-  /* 确保内容区域在移动端可以正常滚动 */
-  #root {
-    overflow: visible !important;
-    height: 100% !important;
-  }
 
   /* 移动端表格样式调整 */
   .semi-table-tbody,