From 787fa279490bca4fdc4f50a0c9f4a6bd98b8fbe2 Mon Sep 17 00:00:00 2001
From: kkfluous <kkfluous@kdemacbook-air.local>
Date: Thu, 2 Apr 2026 00:15:38 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20overflow-x-hidden=20=E6=94=B9=E4=B8=BA?=
 =?UTF-8?q?=20overflow-x:clip=20=E4=BF=AE=E5=A4=8D=20sticky=20=E5=90=B8?=
 =?UTF-8?q?=E9=A1=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

overflow-x:hidden 会创建滚动容器导致 position:sticky 失效，
改用 overflow-x:clip 裁剪溢出但不破坏 sticky 定位。

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/components/Shell.tsx               | 2 +-
 src/modules/mileage/MileageModule.tsx  | 2 +-
 src/modules/mileage/StatisticsView.tsx | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/Shell.tsx b/src/components/Shell.tsx
index 889f87b..09d5dc1 100644
--- a/src/components/Shell.tsx
+++ b/src/components/Shell.tsx
@@ -58,7 +58,7 @@ export function Shell({ modules }: { modules: ModuleConfig[] }) {
       </nav>
 
       {/* 内容区 */}
-      <main className="flex-1 md:ml-16 pb-16 md:pb-0 min-w-0 overflow-x-hidden">
+      <main className="flex-1 md:ml-16 pb-16 md:pb-0 min-w-0" style={{ overflowX: 'clip' }}>
         {ActiveComponent && <ActiveComponent />}
       </main>
 
diff --git a/src/modules/mileage/MileageModule.tsx b/src/modules/mileage/MileageModule.tsx
index 82e369e..158c780 100644
--- a/src/modules/mileage/MileageModule.tsx
+++ b/src/modules/mileage/MileageModule.tsx
@@ -9,7 +9,7 @@ export default function MileageModule() {
   const [activeSubTab, setActiveSubTab] = useState<'monitoring' | 'statistics' | 'report'>('monitoring');
 
   return (
-    <div className="min-h-screen bg-[#F8F9FB] text-gray-800 font-sans p-3 md:p-6 relative overflow-x-hidden">
+    <div className="min-h-screen bg-[#F8F9FB] text-gray-800 font-sans p-3 md:p-6 relative" style={{ overflowX: 'clip' }}>
       <div className="max-w-6xl mx-auto flex flex-col gap-3 pb-16 landscape:pb-0 landscape:h-full landscape:flex-1 landscape:overflow-hidden">
         {/* Sub-navigation — sticky */}
         <div className="bg-white px-4 py-2 rounded-2xl border border-slate-100 shadow-sm flex items-center gap-6 sticky top-0 z-30">
diff --git a/src/modules/mileage/StatisticsView.tsx b/src/modules/mileage/StatisticsView.tsx
index 72021b2..bb437cb 100644
--- a/src/modules/mileage/StatisticsView.tsx
+++ b/src/modules/mileage/StatisticsView.tsx
@@ -62,7 +62,7 @@ export default function StatisticsView() {
   }, [selectedTargetId]);
 
   return (
-    <div className="space-y-2 pb-2 landscape:pb-4 landscape:h-full landscape:overflow-hidden landscape:flex landscape:flex-col flex-none landscape:flex-1 overflow-x-hidden">
+    <div className="space-y-2 pb-2 landscape:pb-4 landscape:h-full landscape:overflow-hidden landscape:flex landscape:flex-col flex-none landscape:flex-1" style={{ overflowX: 'clip' }}>
       {/* Project Selector - Full width even in landscape */}
       <div className="bg-white landscape:bg-slate-900/50 landscape:border-slate-800 p-2 rounded-2xl shadow-sm border border-slate-100 flex gap-1 overflow-x-auto no-scrollbar flex-shrink-0">
         {targets.map(target => (