fix: 修正操作手冊捲軸行為與容器高度

resources/js/Layouts/AuthenticatedLayout.tsx

@@ -640,13 +640,13 @@ export default function AuthenticatedLayout({
 
             {/* Main Content */}
             <main className={cn(
-                "flex-1 flex flex-col transition-all duration-300 min-h-screen overflow-auto",
+                "flex-1 flex flex-col transition-all duration-300 min-h-screen",
                 "lg:ml-64",
                 isCollapsed && "lg:ml-20",
                 "pt-16" // 始終為頁首保留空間
             )}>
-                <div className="relative">
-                    <div className="container mx-auto px-6 pt-6 max-w-7xl">
+                <div className="relative flex-1 flex flex-col min-h-0">
+                    <div className="container mx-auto px-6 pt-6 max-w-7xl shrink-0">
                         {breadcrumbs && breadcrumbs.length > 1 && (
                             <BreadcrumbNav items={breadcrumbs} className="mb-2" />
                         )}

resources/js/Pages/System/Manual/Index.tsx

@@ -102,7 +102,7 @@ export default function ManualIndex({ toc, currentSlug, content }: Props) {
                 {/* Main Content */}
                 <main className="flex-1 flex flex-col min-w-0 bg-white">
                     {/* Content Header mobile toggle */}
-                    <div className="h-14 border-b border-slate-100 flex items-center px-6 gap-3 bg-white/80 backdrop-blur-md sticky top-0 z-10">
+                    <div className="h-14 shrink-0 border-b border-slate-100 flex items-center px-6 gap-3 bg-white/80 backdrop-blur-md sticky top-0 z-10">
                         <button
                             onClick={() => setIsSidebarOpen(!isSidebarOpen)}
                             className="p-2 hover:bg-slate-100 rounded-lg text-slate-500 transition-colors border border-transparent hover:border-slate-200"
@@ -117,7 +117,7 @@ export default function ManualIndex({ toc, currentSlug, content }: Props) {
                         </div>
                     </div>
 
-                    <ScrollArea className="flex-1 bg-white">
+                    <div className="flex-1 overflow-y-auto bg-white" id="manual-content-scroll">
                         <div className="max-w-4xl mx-auto p-8 md:p-16 lg:p-20">
                             <article className="prose prose-slate lg:prose-lg max-w-none 
                                 prose-headings:text-slate-900 prose-headings:tracking-tight
@@ -144,7 +144,7 @@ export default function ManualIndex({ toc, currentSlug, content }: Props) {
                                 </div>
                             </div>
                         </div>
-                    </ScrollArea>
+                    </div>
                 </main>
             </div>
         </AuthenticatedLayout>