From 022d0242e6aeefcf1853d2c886a423d43eed68ce Mon Sep 17 00:00:00 2001 From: bender Date: Sat, 7 Mar 2026 03:22:53 +0000 Subject: [PATCH] Update src/app/page.tsx --- src/app/page.tsx | 125 ++++++++++++++++++++++++----------------------- 1 file changed, 63 insertions(+), 62 deletions(-) diff --git a/src/app/page.tsx b/src/app/page.tsx index 726c15e..8343741 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -19,73 +19,74 @@ export default function LandingPage() { useEffect(() => { // Register ScrollTrigger plugin - const { default: ScrollTrigger } = require('gsap/ScrollTrigger'); - gsap.registerPlugin(ScrollTrigger); + import('gsap/ScrollTrigger').then(({ default: ScrollTrigger }) => { + gsap.registerPlugin(ScrollTrigger); - // Animate contact section on scroll - if (contactRef.current) { - const ctx = gsap.context(() => { - // Title animation - gsap.from('[data-contact-title]', { - scrollTrigger: { - trigger: contactRef.current, - start: 'top 60%', - end: 'top 30%', - scrub: 1, - markers: false, - }, - opacity: 0, - y: 50, - duration: 1, - }); + // Animate contact section on scroll + if (contactRef.current) { + const ctx = gsap.context(() => { + // Title animation + gsap.from('[data-contact-title]', { + scrollTrigger: { + trigger: contactRef.current, + start: 'top 60%', + end: 'top 30%', + scrub: 1, + markers: false, + }, + opacity: 0, + y: 50, + duration: 1, + }); - // Description animation with stagger - gsap.from('[data-contact-description]', { - scrollTrigger: { - trigger: contactRef.current, - start: 'top 55%', - end: 'top 25%', - scrub: 1, - markers: false, - }, - opacity: 0, - y: 40, - duration: 1, - delay: 0.2, - }); + // Description animation with stagger + gsap.from('[data-contact-description]', { + scrollTrigger: { + trigger: contactRef.current, + start: 'top 55%', + end: 'top 25%', + scrub: 1, + markers: false, + }, + opacity: 0, + y: 40, + duration: 1, + delay: 0.2, + }); - // Button animation - gsap.from('[data-contact-button]', { - scrollTrigger: { - trigger: contactRef.current, - start: 'top 50%', - end: 'top 20%', - scrub: 1, - markers: false, - }, - opacity: 0, - scale: 0.8, - duration: 1, - delay: 0.4, - }); + // Button animation + gsap.from('[data-contact-button]', { + scrollTrigger: { + trigger: contactRef.current, + start: 'top 50%', + end: 'top 20%', + scrub: 1, + markers: false, + }, + opacity: 0, + scale: 0.8, + duration: 1, + delay: 0.4, + }); - // Background animated elements - gsap.to('[data-contact-bg-element]', { - scrollTrigger: { - trigger: contactRef.current, - start: 'top center', - end: 'bottom center', - scrub: 2, - markers: false, - }, - rotation: 360, - duration: 20, - repeat: -1, - }); - }, contactRef); + // Background animated elements + gsap.to('[data-contact-bg-element]', { + scrollTrigger: { + trigger: contactRef.current, + start: 'top center', + end: 'bottom center', + scrub: 2, + markers: false, + }, + rotation: 360, + duration: 20, + repeat: -1, + }); + }, contactRef); - return () => ctx.revert(); - } + return () => ctx.revert(); + } + }); }, []); return ( -- 2.49.1