Merge version_2 into main #1
178
src/app/page.tsx
178
src/app/page.tsx
@@ -32,30 +32,18 @@ export default function LandingPage() {
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Features",
|
||||
id: "features",
|
||||
},
|
||||
name: "Features", id: "features"},
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
name: "Products", id: "/products"},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
name: "Testimonials", id: "testimonials"},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "faq",
|
||||
},
|
||||
name: "FAQ", id: "faq"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
button={{
|
||||
text: "Shop Now",
|
||||
href: "#products",
|
||||
}}
|
||||
text: "Shop Now", href: "/products"}}
|
||||
brandName="AquaPaint 3D"
|
||||
/>
|
||||
</div>
|
||||
@@ -63,33 +51,22 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
variant: "sparkles-gradient"}}
|
||||
title="Water Paint That Transforms Spaces Beautifully"
|
||||
description="Ecofriendly, professional-grade waterbased paint with vibrant colors and lasting durability. See your vision come to life in stunning 3D."
|
||||
avatars={[
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-professional-painter-diverse-ethnicity-1774359613790-a71ea3fb.png",
|
||||
alt: "Professional Painter",
|
||||
},
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-professional-painter-diverse-ethnicity-1774359613790-a71ea3fb.png", alt: "Professional Painter"},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/an-interior-designer-modern-style-lookin-1774359613928-89822c38.png",
|
||||
alt: "Interior Designer",
|
||||
},
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/an-interior-designer-modern-style-lookin-1774359613928-89822c38.png", alt: "Interior Designer"},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-homeowner-casual-and-friendly-envision-1774359613892-1303d4c6.png",
|
||||
alt: "Homeowner",
|
||||
},
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-homeowner-casual-and-friendly-envision-1774359613892-1303d4c6.png", alt: "Homeowner"},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/an-architect-serious-and-professional-re-1774359613879-003fb5b1.png",
|
||||
alt: "Architect",
|
||||
},
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/an-architect-serious-and-professional-re-1774359613879-003fb5b1.png", alt: "Architect"},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore Our Colors",
|
||||
href: "#products",
|
||||
},
|
||||
text: "Explore Our Colors", href: "/products"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -109,35 +86,17 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Immersive 3D Visualization",
|
||||
tags: [
|
||||
"Innovation",
|
||||
"Visualize",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-hand-holding-a-tablet-displaying-a-liv-1774359614432-61f74705.png",
|
||||
imageAlt: "Tablet displaying 3D paint visualization",
|
||||
},
|
||||
id: "1", title: "Immersive 3D Visualization", tags: [
|
||||
"Innovation", "Visualize"],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-hand-holding-a-tablet-displaying-a-liv-1774359614432-61f74705.png", imageAlt: "Tablet displaying 3D paint visualization"},
|
||||
{
|
||||
id: "2",
|
||||
title: "Eco-Friendly Formulation",
|
||||
tags: [
|
||||
"Sustainable",
|
||||
"Green",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-green-leaf-with-a-drop-of-water-based--1774359613548-5fce8e9b.png",
|
||||
imageAlt: "Green leaf with paint drop",
|
||||
},
|
||||
id: "2", title: "Eco-Friendly Formulation", tags: [
|
||||
"Sustainable", "Green"],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-green-leaf-with-a-drop-of-water-based--1774359613548-5fce8e9b.png", imageAlt: "Green leaf with paint drop"},
|
||||
{
|
||||
id: "3",
|
||||
title: "Unmatched Durability & Coverage",
|
||||
tags: [
|
||||
"Lasting",
|
||||
"Quality",
|
||||
],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-painted-wall-segment-showing-extreme-d-1774359614397-c2103c73.png",
|
||||
imageAlt: "Durable painted wall",
|
||||
},
|
||||
id: "3", title: "Unmatched Durability & Coverage", tags: [
|
||||
"Lasting", "Quality"],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-painted-wall-segment-showing-extreme-d-1774359614397-c2103c73.png", imageAlt: "Durable painted wall"},
|
||||
]}
|
||||
title="Experience Paint Like Never Before"
|
||||
description="Discover why AquaPaint 3D is the preferred choice for those who demand excellence and sustainability. Visualize colors in real environments and trust in lasting quality."
|
||||
@@ -153,26 +112,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Blue Ocean",
|
||||
price: "$45.00",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-can-of-blue-ocean-water-paint-with-a-s-1774359613568-221f773c.png",
|
||||
imageAlt: "Blue Ocean paint can",
|
||||
},
|
||||
id: "1", name: "Blue Ocean", price: "$45.00", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-can-of-blue-ocean-water-paint-with-a-s-1774359613568-221f773c.png", imageAlt: "Blue Ocean paint can"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Emerald Forest",
|
||||
price: "$45.00",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-can-of-emerald-forest-water-paint-feat-1774359614300-4f91757a.png",
|
||||
imageAlt: "Emerald Forest paint can",
|
||||
},
|
||||
id: "2", name: "Emerald Forest", price: "$45.00", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-can-of-emerald-forest-water-paint-feat-1774359614300-4f91757a.png", imageAlt: "Emerald Forest paint can"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Sunny Yellow",
|
||||
price: "$45.00",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-can-of-sunny-yellow-water-paint-a-brig-1774359614621-bb0b1a74.png",
|
||||
imageAlt: "Sunny Yellow paint can",
|
||||
},
|
||||
id: "3", name: "Sunny Yellow", price: "$45.00", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-can-of-sunny-yellow-water-paint-a-brig-1774359614621-bb0b1a74.png", imageAlt: "Sunny Yellow paint can"},
|
||||
]}
|
||||
title="Vibrant Hues, Endless Possibilities"
|
||||
description="Browse our extensive collection of water-based paints, crafted for superior coverage and breathtaking finish. Find the perfect shade to bring your design vision to life."
|
||||
@@ -186,33 +130,13 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah J.",
|
||||
role: "Professional Painter",
|
||||
testimonial: "AquaPaint 3D's colors are incredibly vibrant and the coverage is excellent. My clients love the finish, and I appreciate the eco-friendly formula.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-professional-painter-woman-mid-30s-smi-1774359613375-21634c14.png",
|
||||
},
|
||||
id: "1", name: "Sarah J.", role: "Professional Painter", testimonial: "AquaPaint 3D's colors are incredibly vibrant and the coverage is excellent. My clients love the finish, and I appreciate the eco-friendly formula.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-professional-painter-woman-mid-30s-smi-1774359613375-21634c14.png"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Michael C.",
|
||||
role: "Interior Designer",
|
||||
testimonial: "The 3D visualization feature is a game-changer for my projects. It helps clients truly envision the space, and the durability of the paint is exceptional.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/an-interior-designer-man-early-40s-thoug-1774359613950-1ec7ae0f.png",
|
||||
},
|
||||
id: "2", name: "Michael C.", role: "Interior Designer", testimonial: "The 3D visualization feature is a game-changer for my projects. It helps clients truly envision the space, and the durability of the paint is exceptional.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/an-interior-designer-man-early-40s-thoug-1774359613950-1ec7ae0f.png"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily R.",
|
||||
role: "Homeowner",
|
||||
testimonial: "I used AquaPaint 3D for my living room, and I couldn't be happier. The color is beautiful, it was easy to apply, and it's reassuring to know it's safe for my family.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-homeowner-woman-late-20s-excited-and-s-1774359613403-ae8263d9.png",
|
||||
},
|
||||
id: "3", name: "Emily R.", role: "Homeowner", testimonial: "I used AquaPaint 3D for my living room, and I couldn't be happier. The color is beautiful, it was easy to apply, and it's reassuring to know it's safe for my family.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-homeowner-woman-late-20s-excited-and-s-1774359613403-ae8263d9.png"},
|
||||
{
|
||||
id: "4",
|
||||
name: "David K.",
|
||||
role: "Construction Manager",
|
||||
testimonial: "For large-scale projects, AquaPaint 3D provides consistent quality and superior environmental standards. It's a reliable choice for sustainable construction.",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-construction-company-manager-man-late--1774359614417-f033321e.png",
|
||||
},
|
||||
id: "4", name: "David K.", role: "Construction Manager", testimonial: "For large-scale projects, AquaPaint 3D provides consistent quality and superior environmental standards. It's a reliable choice for sustainable construction.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-construction-company-manager-man-late--1774359614417-f033321e.png"},
|
||||
]}
|
||||
title="What Our Customers Say"
|
||||
description="Hear from professional painters, interior designers, and homeowners who have transformed their spaces with AquaPaint 3D."
|
||||
@@ -224,20 +148,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "What makes AquaPaint 3D eco-friendly?",
|
||||
content: "Our paints are water-based, low-VOC (Volatile Organic Compounds), and free from harmful chemicals, ensuring a healthier environment during and after application. We prioritize sustainable sourcing for all our ingredients.",
|
||||
},
|
||||
id: "1", title: "What makes AquaPaint 3D eco-friendly?", content: "Our paints are water-based, low-VOC (Volatile Organic Compounds), and free from harmful chemicals, ensuring a healthier environment during and after application. We prioritize sustainable sourcing for all our ingredients."},
|
||||
{
|
||||
id: "2",
|
||||
title: "How does 3D visualization work?",
|
||||
content: "Our innovative platform allows you to upload a photo of your space and virtually 'paint' it with our colors. This provides a realistic preview of how different shades will look in your unique environment, minimizing uncertainty.",
|
||||
},
|
||||
id: "2", title: "How does 3D visualization work?", content: "Our innovative platform allows you to upload a photo of your space and virtually 'paint' it with our colors. This provides a realistic preview of how different shades will look in your unique environment, minimizing uncertainty."},
|
||||
{
|
||||
id: "3",
|
||||
title: "What about durability and coverage?",
|
||||
content: "AquaPaint 3D is formulated for exceptional durability, resisting scuffs, fading, and moisture. Our advanced pigments ensure superior coverage, often requiring fewer coats than traditional paints, saving you time and money.",
|
||||
},
|
||||
id: "3", title: "What about durability and coverage?", content: "AquaPaint 3D is formulated for exceptional durability, resisting scuffs, fading, and moisture. Our advanced pigments ensure superior coverage, often requiring fewer coats than traditional paints, saving you time and money."},
|
||||
]}
|
||||
sideTitle="Common Questions"
|
||||
sideDescription="Find answers to your most pressing questions about AquaPaint 3D products, application, and benefits."
|
||||
@@ -252,27 +167,16 @@ export default function LandingPage() {
|
||||
description="Reach out to our team for product inquiries, bulk orders, or expert advice. We're here to help you bring your vision to life."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
name: "name", type: "text", placeholder: "Your Name", required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Your Email",
|
||||
required: true,
|
||||
name: "email", type: "email", placeholder: "Your Email", required: true,
|
||||
},
|
||||
{
|
||||
name: "subject",
|
||||
type: "text",
|
||||
placeholder: "Subject",
|
||||
},
|
||||
name: "subject", type: "text", placeholder: "Subject"},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Your Message",
|
||||
rows: 4,
|
||||
name: "message", placeholder: "Your Message", rows: 4,
|
||||
required: true,
|
||||
}}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-vibrant-flowing-abstract-background-wi-1774359615713-733e39e7.png"
|
||||
@@ -290,19 +194,13 @@ export default function LandingPage() {
|
||||
socialLinks={[
|
||||
{
|
||||
icon: Twitter,
|
||||
href: "https://twitter.com",
|
||||
ariaLabel: "Twitter",
|
||||
},
|
||||
href: "https://twitter.com", ariaLabel: "Twitter"},
|
||||
{
|
||||
icon: Instagram,
|
||||
href: "https://instagram.com",
|
||||
ariaLabel: "Instagram",
|
||||
},
|
||||
href: "https://instagram.com", ariaLabel: "Instagram"},
|
||||
{
|
||||
icon: Linkedin,
|
||||
href: "https://linkedin.com",
|
||||
ariaLabel: "LinkedIn",
|
||||
},
|
||||
href: "https://linkedin.com", ariaLabel: "LinkedIn"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
84
src/app/products/page.tsx
Normal file
84
src/app/products/page.tsx
Normal file
@@ -0,0 +1,84 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||||
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||
import { Instagram, Linkedin, Twitter } from "lucide-react";
|
||||
|
||||
export default function ProductsPage() {
|
||||
const navItems = [
|
||||
{ name: "Features", id: "/#features" },
|
||||
{ name: "Products", id: "/products" },
|
||||
{ name: "Testimonials", id: "/#testimonials" },
|
||||
{ name: "FAQ", id: "/#faq" },
|
||||
{ name: "Contact", id: "/#contact" }
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-bubble"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="pill"
|
||||
contentWidth="mediumLarge"
|
||||
sizing="largeSmall"
|
||||
background="none"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="shadow"
|
||||
secondaryButtonStyle="layered"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={navItems}
|
||||
button={{
|
||||
text: "Shop Now", href: "/products"}}
|
||||
brandName="AquaPaint 3D"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products-content" data-section="products-content">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
title="Our Full Range of Vibrant Water Paints"
|
||||
description="Explore our complete catalog of eco-friendly, high-quality water-based paints. Find the perfect shade and finish for any project, from professional applications to home DIY."
|
||||
products={[
|
||||
{
|
||||
id: "1", name: "Blue Ocean", price: "$45.00", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-can-of-blue-ocean-water-paint-with-a-s-1774359613568-221f773c.png", imageAlt: "Blue Ocean paint can"},
|
||||
{
|
||||
id: "2", name: "Emerald Forest", price: "$45.00", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-can-of-emerald-forest-water-paint-feat-1774359614300-4f91757a.png", imageAlt: "Emerald Forest paint can"},
|
||||
{
|
||||
id: "3", name: "Sunny Yellow", price: "$45.00", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-can-of-sunny-yellow-water-paint-a-brig-1774359614621-bb0b1a74.png", imageAlt: "Sunny Yellow paint can"},
|
||||
{
|
||||
id: "4", name: "Ruby Red", price: "$45.00", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-can-of-blue-ocean-water-paint-with-a-s-1774359613568-221f773c.png",
|
||||
imageAlt: "Ruby Red paint can"},
|
||||
{
|
||||
id: "5", name: "Violet Bloom", price: "$45.00", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-can-of-emerald-forest-water-paint-feat-1774359614300-4f91757a.png",
|
||||
imageAlt: "Violet Bloom paint can"},
|
||||
{
|
||||
id: "6", name: "Pure White", price: "$40.00", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BOUFo7Q0y4A7yE6eGG5YTyQlwv/a-can-of-sunny-yellow-water-paint-a-brig-1774359614621-bb0b1a74.png",
|
||||
imageAlt: "Pure White paint can"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
logoText="AquaPaint 3D"
|
||||
copyrightText="© 2024 AquaPaint 3D. All rights reserved."
|
||||
socialLinks={[
|
||||
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
|
||||
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
|
||||
{ icon: Linkedin, href: "https://linkedin.com", ariaLabel: "LinkedIn" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user