Update src/app/page.tsx
This commit is contained in:
@@ -1,12 +1,12 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||
import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
|
||||
import FeatureCardTwelve from "@/components/sections/feature/FeatureCardTwelve";
|
||||
import TestimonialCardTwo from "@/components/sections/testimonial/TestimonialCardTwo";
|
||||
import ContactCenter from "@/components/sections/contact/ContactCenter";
|
||||
import FooterCard from "@/components/sections/footer/FooterCard";
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
|
||||
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
|
||||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||
import { Award, Github, Linkedin, Sparkles, Twitter, Zap } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
@@ -17,7 +17,7 @@ export default function LandingPage() {
|
||||
borderRadius="soft"
|
||||
contentWidth="smallMedium"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="aurora"
|
||||
background="circleGradient"
|
||||
cardStyle="inset"
|
||||
primaryButtonStyle="flat"
|
||||
secondaryButtonStyle="glass"
|
||||
@@ -43,41 +43,41 @@ export default function LandingPage() {
|
||||
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="entrance-slide"
|
||||
background={{ variant: "aurora" }}
|
||||
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"
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/abstract-flowing-water-surface-with-ligh-1773218772184-a9a7d3b1.png", imageAlt: "Water ripple effect visualization"
|
||||
},
|
||||
{
|
||||
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"
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/modern-tech-interface-showing-three-js-w-1773218772108-65e4b577.png", imageAlt: "WebGL technology stack"
|
||||
},
|
||||
{
|
||||
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"
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/performance-metrics-dashboard-with-real--1773218772274-2dba3a8b.png", imageAlt: "Performance metrics"
|
||||
},
|
||||
{
|
||||
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"
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/user-cursor-creating-ripple-waves-on-tou-1773218772133-39c358c8.png", 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/user-cursor-creating-ripple-waves-on-tou-1773218772133-39c358c8.png", 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/performance-metrics-dashboard-with-real--1773218772274-2dba3a8b.png", 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/abstract-flowing-water-surface-with-ligh-1773218772184-a9a7d3b1.png", 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"
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AnBXSm0K43AohJfssOupZapXhQ/modern-tech-interface-showing-three-js-w-1773218772108-65e4b577.png", imageAlt: "Advanced rendering"
|
||||
}
|
||||
]}
|
||||
buttons={[
|
||||
{ text: "Explore Demo", href: "#experience" },
|
||||
{ text: "Learn More", href: "#features" }
|
||||
]}
|
||||
buttonAnimation="entrance-slide"
|
||||
buttonAnimation="blur-reveal"
|
||||
carouselPosition="right"
|
||||
/>
|
||||
</div>
|
||||
@@ -88,7 +88,7 @@ export default function LandingPage() {
|
||||
description="Cutting-edge WebGL technology for immersive interactive experiences"
|
||||
tag="Technical Features"
|
||||
tagIcon={Sparkles}
|
||||
tagAnimation="entrance-slide"
|
||||
tagAnimation="blur-reveal"
|
||||
features={[
|
||||
{
|
||||
id: "realtime", label: "Real-time", title: "60 FPS Smooth Animation", items: [
|
||||
@@ -118,7 +118,7 @@ export default function LandingPage() {
|
||||
description="See what industry leaders say about our WebGL water effect technology"
|
||||
tag="Testimonials"
|
||||
tagIcon={Award}
|
||||
tagAnimation="entrance-slide"
|
||||
tagAnimation="blur-reveal"
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Alexandra Chen", role: "Creative Technologist", testimonial: "The water ripple effect is stunning. The responsiveness to cursor movement creates an incredibly engaging user experience that keeps visitors captivated.", 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"
|
||||
@@ -144,10 +144,10 @@ export default function LandingPage() {
|
||||
<ContactCenter
|
||||
tag="Get Connected"
|
||||
tagIcon={Zap}
|
||||
tagAnimation="entrance-slide"
|
||||
tagAnimation="blur-reveal"
|
||||
title="Ready to Dive In?"
|
||||
description="Join developers and designers creating next-generation web experiences. Subscribe to our newsletter for updates on new WebGL effects and interactive technologies."
|
||||
background={{ variant: "aurora" }}
|
||||
background={{ variant: "plain" }}
|
||||
useInvertedBackground={false}
|
||||
inputPlaceholder="Enter your email"
|
||||
buttonText="Notify Me"
|
||||
|
||||
Reference in New Issue
Block a user