bender/19b7f2ba-1c3e-48f8-a20e-e0b1035104f7
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-03-11 08:52:47 +00:00
parent 32c2ed9814
commit 8f16b523d7
1 changed files with 14 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/app/page.tsx
View File

@@ -2,7 +2,7 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
import HeroBillboardTestimonial from '@/components/sections/hero/HeroBillboardTestimonial';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import ContactCenter from '@/components/sections/contact/ContactCenter';
@@ -38,39 +38,32 @@ export default function LandingPage() {
</div>
<div id="hero" data-section="hero">
<HeroSplitDoubleCarousel
<HeroBillboardTestimonial
title="Interactive Water Surface with Cursor Control"
description="Experience fluid dynamics in real-time. Move your cursor to create ripples and waves that distort and refract the text beneath. Built with Three.js and WebGL for smooth, responsive interaction."
tag="WebGL Experience"
tagIcon={Zap}
tagAnimation="blur-reveal"
background={{ variant: "plain" }}
leftCarouselItems={[
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/abstract-flowing-water-surface-with-ligh-1773218772184-a9a7d3b1.png?_wi=1"
imageAlt="Water ripple effect visualization"
mediaAnimation="blur-reveal"
testimonials={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/abstract-flowing-water-surface-with-ligh-1773218772184-a9a7d3b1.png?_wi=1", imageAlt: "Water ripple effect visualization"
name: "Alexandra Chen", handle: "Creative Technologist", testimonial: "The water ripple effect is stunning. The responsiveness to cursor movement creates an incredibly engaging user experience that keeps visitors captivated.", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/professional-headshot-of-a-tech-develope-1773218771771-f3c90e2a.png", imageAlt: "Alexandra Chen"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/modern-tech-interface-showing-three-js-w-1773218772108-65e4b577.png?_wi=1", imageAlt: "WebGL technology stack"
name: "Marcus Rodriguez", handle: "Senior Developer", testimonial: "Exceptional WebGL implementation. The shader quality and performance optimization make this the best interactive water effect I've encountered. Highly recommended.", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/professional-headshot-of-a-creative-desi-1773218771682-c924473b.png", imageAlt: "Marcus Rodriguez"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/performance-metrics-dashboard-with-real--1773218772274-2dba3a8b.png?_wi=1", imageAlt: "Performance metrics"
name: "Sarah Thompson", handle: "Product Designer", testimonial: "Our clients are amazed by the visual impact. The distortion effect adds a layer of sophistication to our landing pages that sets us apart from competitors.", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/professional-headshot-of-a-product-manag-1773218771919-1fa1d4af.png", imageAlt: "Sarah Thompson"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/user-cursor-creating-ripple-waves-on-tou-1773218772133-39c358c8.png?_wi=1", imageAlt: "Interactive water response"
}
]}
rightCarouselItems={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/user-cursor-creating-ripple-waves-on-tou-1773218772133-39c358c8.png?_wi=2", imageAlt: "Cursor interaction ripples"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/performance-metrics-dashboard-with-real--1773218772274-2dba3a8b.png?_wi=2", imageAlt: "Real-time performance"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/abstract-flowing-water-surface-with-ligh-1773218772184-a9a7d3b1.png?_wi=2", imageAlt: "Fluid simulation"
},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/modern-tech-interface-showing-three-js-w-1773218772108-65e4b577.png?_wi=2", imageAlt: "Advanced rendering"
name: "James Mitchell", handle: "Technical Director", testimonial: "The performance metrics are impressive. Zero frame drops even with complex scenes. This is production-ready technology that delivers results.", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/professional-headshot-of-a-creative-dire-1773218771785-fe8d39e4.png", imageAlt: "James Mitchell"
}
]}
buttons={[
@@ -78,7 +71,6 @@ export default function LandingPage() {
{ text: "Learn More", href: "#features" }
]}
buttonAnimation="blur-reveal"
carouselPosition="right"
/>
</div>