ourworld_web/www_mycelium_net
23
0
Fork 0
forked from sashaastiadi/www_mycelium_net
Code Issues Pull Requests Activity

fix: improve About section positioning with sticky background and relative content

Browse Source
This commit is contained in:
sasha-astiadi
2025-10-22 14:18:11 +02:00
parent d197ca74ad
commit e7b053bd76
1 changed files with 31 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/About.tsx
View File

@@ -8,11 +8,12 @@ export function About() {
return ( return (
<section <section
id="about" id="about"
className="relative overflow-hidden bg-gray-900 py-20 lg:py-32 lg:top-0 top-0" className="relative bg-gray-900 py-20 lg:py-32"
> >
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2"> <div className="sticky top-0 flex h-screen items-center justify-center">
<CircleBackground color="#06b6d4" className="animate-spin-slower" /> <CircleBackground color="#06b6d4" className="animate-spin-slower" />
</div> </div>
<div className="relative -mt-[100vh]">
<Container> <Container>
<div className="mx-auto max-w-3xl text-center"> <div className="mx-auto max-w-3xl text-center">
<Eyebrow color="accent">Our Mission</Eyebrow> <Eyebrow color="accent">Our Mission</Eyebrow>
@@ -41,6 +42,7 @@ export function About() {
</div> </div>
</div> </div>
</Container> </Container>
</div>
</section> </section>
) )
} }