|
|
@@ -488,24 +488,31 @@ const DashboardGrid = () => (
|
|
|
const HomePage = () => {
|
|
|
return (
|
|
|
<div className="fixed inset-0 bg-gradient-to-br from-gray-900 via-black to-gray-900 overflow-hidden">
|
|
|
- {/* 3D背景 */}
|
|
|
- <Canvas className="absolute inset-0">
|
|
|
- <Stars radius={100} depth={50} count={5000} factor={4} saturation={0} fade speed={1} />
|
|
|
- </Canvas>
|
|
|
+ {/* 3D背景 - 明确作为背景层 */}
|
|
|
+ <div className="absolute inset-0 z-0">
|
|
|
+ <Canvas
|
|
|
+ camera={{ position: [0, 0, 1], fov: 75 }}
|
|
|
+ style={{ position: 'absolute', top: 0, left: 0, width: '100%', height: '100%' }}
|
|
|
+ >
|
|
|
+ <Stars radius={100} depth={50} count={5000} factor={4} saturation={0} fade speed={1} />
|
|
|
+ </Canvas>
|
|
|
+ </div>
|
|
|
|
|
|
{/* 网格背景 */}
|
|
|
- <div className="absolute inset-0 bg-[linear-gradient(to_right,#ffffff08_1px,transparent_1px),linear-gradient(to_bottom,#ffffff08_1px,transparent_1px)] bg-[size:50px_50px]" />
|
|
|
+ <div className="absolute inset-0 z-0 bg-[linear-gradient(to_right,#ffffff08_1px,transparent_1px),linear-gradient(to_bottom,#ffffff08_1px,transparent_1px)] bg-[size:50px_50px]" />
|
|
|
|
|
|
- {/* 主内容层 */}
|
|
|
- <div className="relative z-10 h-full flex flex-col">
|
|
|
+ {/* 主内容层 - 确保在顶层 */}
|
|
|
+ <div className="relative z-10 w-full h-full overflow-auto">
|
|
|
<DashboardGrid />
|
|
|
</div>
|
|
|
|
|
|
{/* 动态光效 */}
|
|
|
- <div className="absolute inset-0 bg-gradient-to-r from-cyan-500/10 via-transparent to-purple-500/10 animate-pulse" />
|
|
|
+ <div className="absolute inset-0 z-5 bg-gradient-to-r from-cyan-500/10 via-transparent to-purple-500/10 animate-pulse pointer-events-none" />
|
|
|
|
|
|
{/* 扫描线效果 */}
|
|
|
- <ScanningLine />
|
|
|
+ <div className="absolute inset-0 z-5 pointer-events-none">
|
|
|
+ <ScanningLine />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
);
|
|
|
};
|