revert: restore Hero, Modules, CSS to original state
All layout changes (blob modifications, overflow-x/clip, scrollbar-gutter) reverted to the original version that was working correctly. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>claude/bold-hawking
parent
81d673a3e8
commit
0d72750982
|
|
@ -13,9 +13,9 @@ export default function Hero() {
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section className="relative pt-28 pb-12 md:pt-36 md:pb-16 overflow-clip flex flex-col items-center justify-center text-center px-6">
|
<section className="relative pt-28 pb-12 md:pt-36 md:pb-16 overflow-hidden flex flex-col items-center justify-center text-center px-6">
|
||||||
{/* Background Gradient — centered and symmetric */}
|
{/* Background Gradient */}
|
||||||
<div className="absolute inset-0 -z-10 bg-[radial-gradient(ellipse_at_center_top,_rgba(224,231,255,0.5)_0%,_rgba(245,243,255,0.3)_40%,_transparent_70%)]"></div>
|
<div className="absolute inset-0 -z-10 bg-[radial-gradient(ellipse_at_top,_var(--tw-gradient-stops))] from-indigo-100 via-purple-50 to-pink-50 opacity-70"></div>
|
||||||
|
|
||||||
<div className="max-w-4xl mx-auto">
|
<div className="max-w-4xl mx-auto">
|
||||||
<motion.div
|
<motion.div
|
||||||
|
|
@ -78,7 +78,10 @@ export default function Hero() {
|
||||||
</motion.div>
|
</motion.div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* No decorative blobs — clean symmetric background */}
|
{/* Decorative elements */}
|
||||||
|
<div className="absolute top-1/4 left-10 w-64 h-64 bg-purple-300 rounded-full mix-blend-multiply filter blur-3xl opacity-30 animate-blob pointer-events-none"></div>
|
||||||
|
<div className="absolute top-1/3 right-10 w-64 h-64 bg-pink-300 rounded-full mix-blend-multiply filter blur-3xl opacity-30 animate-blob animation-delay-2000 pointer-events-none"></div>
|
||||||
|
<div className="absolute -bottom-8 left-1/2 -translate-x-1/2 w-64 h-64 bg-indigo-300 rounded-full mix-blend-multiply filter blur-3xl opacity-30 animate-blob animation-delay-4000 pointer-events-none"></div>
|
||||||
</section>
|
</section>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -116,13 +116,11 @@ const ModuleCard: React.FC<{ mod: any, className?: string }> = ({ mod, className
|
||||||
|
|
||||||
export default function Modules() {
|
export default function Modules() {
|
||||||
return (
|
return (
|
||||||
<section id="modules" className="py-24 md:py-32 bg-white px-6 overflow-clip relative">
|
<section id="modules" className="py-24 md:py-32 bg-white px-6 overflow-hidden relative">
|
||||||
{/* Animated Background Blobs — contained within section via max-w and inset */}
|
{/* Animated Background Blobs */}
|
||||||
<div className="absolute inset-0 overflow-clip pointer-events-none">
|
<div className="absolute top-[-10%] left-[-10%] w-[50vw] h-[50vw] min-w-[600px] min-h-[600px] rounded-full bg-[#fff3eb] opacity-80 blur-[120px] animate-blob-large pointer-events-none"></div>
|
||||||
<div className="absolute top-[-10%] left-[-10%] w-[50vw] h-[50vw] max-w-[600px] max-h-[600px] rounded-full bg-[#fff3eb] opacity-80 blur-[120px] animate-blob-large"></div>
|
<div className="absolute top-[20%] right-[-10%] w-[40vw] h-[40vw] min-w-[500px] min-h-[500px] rounded-full bg-[#e4cfff] opacity-40 blur-[120px] animate-blob-large animation-delay-7000 pointer-events-none"></div>
|
||||||
<div className="absolute top-[20%] right-[-5%] w-[40vw] h-[40vw] max-w-[500px] max-h-[500px] rounded-full bg-[#e4cfff] opacity-40 blur-[120px] animate-blob-large animation-delay-7000"></div>
|
<div className="absolute bottom-[-10%] left-[20%] w-[60vw] h-[60vw] min-w-[700px] min-h-[700px] rounded-full bg-[#f5f9ff] opacity-80 blur-[120px] animate-blob-large animation-delay-14000 pointer-events-none"></div>
|
||||||
<div className="absolute bottom-[-10%] left-[20%] w-[50vw] h-[50vw] max-w-[600px] max-h-[600px] rounded-full bg-[#f5f9ff] opacity-80 blur-[120px] animate-blob-large animation-delay-14000"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="max-w-7xl mx-auto relative z-10">
|
<div className="max-w-7xl mx-auto relative z-10">
|
||||||
<motion.div
|
<motion.div
|
||||||
|
|
|
||||||
|
|
@ -62,12 +62,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
@layer base {
|
@layer base {
|
||||||
html {
|
|
||||||
overflow-x: clip;
|
|
||||||
overflow-y: overlay;
|
|
||||||
}
|
|
||||||
body {
|
body {
|
||||||
overflow-x: clip;
|
|
||||||
@apply font-sans text-slate-800 bg-slate-50 antialiased;
|
@apply font-sans text-slate-800 bg-slate-50 antialiased;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue