Merge version_2 into main #2
317
src/app/page.tsx
317
src/app/page.tsx
@@ -9,7 +9,7 @@ import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarS
|
||||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||||
import SplitAbout from '@/components/sections/about/SplitAbout';
|
||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||
import { Mail } from "lucide-react";
|
||||
import { Mail, MessageCircle } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -25,225 +25,114 @@ export default function LandingPage() {
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Process",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="PrintCore"
|
||||
/>
|
||||
</div>
|
||||
<ReactLenis root options={{ lerp: 0.1, duration: 1.5, smoothWheel: true }}>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Process", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="PrintCore"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="Print Your Vision to Life"
|
||||
description="High-quality custom printing for businesses, creative teams, and individuals. From apparel to premium signage."
|
||||
buttons={[
|
||||
{
|
||||
text: "View Our Services",
|
||||
href: "#services",
|
||||
},
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/a-high-end-modern-printing-facility-scen-1774684926827-6d0c0420.png"
|
||||
imageAlt="Professional printing workshop equipment"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="Print Your Vision to Life"
|
||||
description="High-quality custom printing for businesses, creative teams, and individuals. From apparel to premium signage."
|
||||
buttons={[
|
||||
{ text: "View Our Services", href: "#services" },
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/a-high-end-modern-printing-facility-scen-1774684926827-6d0c0420.png"
|
||||
imageAlt="Professional printing workshop equipment"
|
||||
className="parallax-hero"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Precision and Quality at Every Step"
|
||||
description="We blend traditional print craftsmanship with modern technology. Whether it's a thousand business cards or custom branded apparel, our process ensures consistency and speed."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Fast Turnaround",
|
||||
description: "Quick processing for deadlines",
|
||||
},
|
||||
{
|
||||
title: "Premium Materials",
|
||||
description: "High-grade papers and fabrics",
|
||||
},
|
||||
{
|
||||
title: "Expert Team",
|
||||
description: "Designers ready to assist",
|
||||
},
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/a-close-up-of-a-high-precision-printing--1774684925041-e680af75.png"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Precision and Quality at Every Step"
|
||||
description="We blend traditional print craftsmanship with modern technology. Whether it's a thousand business cards or custom branded apparel, our process ensures consistency and speed."
|
||||
bulletPoints={[
|
||||
{ title: "Fast Turnaround", description: "Quick processing for deadlines" },
|
||||
{ title: "Premium Materials", description: "High-grade papers and fabrics" },
|
||||
{ title: "Expert Team", description: "Designers ready to assist" },
|
||||
]}
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/a-close-up-of-a-high-precision-printing--1774684925041-e680af75.png"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Custom T-Shirts",
|
||||
price: "From $15",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/a-high-quality-cotton-t-shirt-with-a-sty-1774684927553-de2fec46.png",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Business Cards",
|
||||
price: "From $40",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/a-stack-of-premium-business-cards-with-g-1774684925285-d992e1fc.png",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Large Signage",
|
||||
price: "From $120",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/large-scale-outdoor-signage-display-mini-1774684926691-a0f9717e.png",
|
||||
},
|
||||
]}
|
||||
title="Our Printing Services"
|
||||
description="Top-tier solutions for all your printing needs."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "Custom T-Shirts", price: "From $15", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/a-high-quality-cotton-t-shirt-with-a-sty-1774684927553-de2fec46.png" },
|
||||
{ id: "p2", name: "Business Cards", price: "From $40", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/a-stack-of-premium-business-cards-with-g-1774684925285-d992e1fc.png" },
|
||||
{ id: "p3", name: "Large Signage", price: "From $120", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/large-scale-outdoor-signage-display-mini-1774684926691-a0f9717e.png" },
|
||||
]}
|
||||
title="Our Printing Services"
|
||||
description="Top-tier solutions for all your printing needs."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Jenkins",
|
||||
date: "2024-05",
|
||||
title: "Marketing Director",
|
||||
quote: "The speed and quality of our custom T-shirts was incredible.",
|
||||
tag: "Apparel",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-successful-businessman-works-laptop_1163-5473.jpg",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/professional-headshot-of-a-happy-busines-1774684924146-81d86a10.png?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Mark Evans",
|
||||
date: "2024-06",
|
||||
title: "Founder",
|
||||
quote: "Our business cards look professional and have premium feel.",
|
||||
tag: "Cards",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-man-work_23-2149741200.jpg",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/professional-headshot-of-a-graphic-desig-1774684927413-496c808f.png",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Lena Brooks",
|
||||
date: "2024-07",
|
||||
title: "Art Director",
|
||||
quote: "Excellent signage printing, exceeded our quality expectations.",
|
||||
tag: "Signage",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/cheerful-asian-executive-leading-people_1262-4716.jpg",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/professional-headshot-of-a-project-manag-1774684926293-83a423e0.png",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "James Miller",
|
||||
date: "2024-08",
|
||||
title: "Startup Lead",
|
||||
quote: "Reliable, fast, and the team is super helpful.",
|
||||
tag: "General",
|
||||
avatarSrc: "http://img.b2bpic.net/free-vector/flat-business-team-avatars_23-2147532927.jpg",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/professional-headshot-of-a-startup-found-1774684924763-135d3566.png",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Elena Rodriguez",
|
||||
date: "2024-09",
|
||||
title: "Event Coordinator",
|
||||
quote: "The print quality for our event banners was sharp and vibrant.",
|
||||
tag: "Signage",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-successful-businessman-works-laptop_1163-5473.jpg",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/professional-headshot-of-a-happy-busines-1774684924146-81d86a10.png?_wi=2",
|
||||
},
|
||||
]}
|
||||
title="Loved by Clients"
|
||||
description="Hear what our partners have to say about our work."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardFive
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah Jenkins", date: "2024-05", title: "Marketing Director", quote: "The speed and quality of our custom T-shirts was incredible.", tag: "Apparel", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-successful-businessman-works-laptop_1163-5473.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/professional-headshot-of-a-happy-busines-1774684924146-81d86a10.png?_wi=1" },
|
||||
{ id: "2", name: "Mark Evans", date: "2024-06", title: "Founder", quote: "Our business cards look professional and have premium feel.", tag: "Cards", avatarSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-man-work_23-2149741200.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/professional-headshot-of-a-graphic-desig-1774684927413-496c808f.png" },
|
||||
{ id: "3", name: "Lena Brooks", date: "2024-07", title: "Art Director", quote: "Excellent signage printing, exceeded our quality expectations.", tag: "Signage", avatarSrc: "http://img.b2bpic.net/free-photo/cheerful-asian-executive-leading-people_1262-4716.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BZ7kTdoPEYzKTns7hZ5A7zOhGy/professional-headshot-of-a-project-manag-1774684926293-83a423e0.png" },
|
||||
]}
|
||||
title="Loved by Clients"
|
||||
description="Hear what our partners have to say about our work."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactFaq
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "What file types do you accept?",
|
||||
content: "We accept AI, PDF, EPS, and high-res JPEG/PNG.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Do you offer shipping?",
|
||||
content: "Yes, we ship nationwide with tracked delivery options.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "How long is turnaround?",
|
||||
content: "Standard printing is 3-5 business days depending on volume.",
|
||||
},
|
||||
]}
|
||||
ctaTitle="Ready to Start Your Project?"
|
||||
ctaDescription="Get in touch today for a free quote on your custom print request."
|
||||
ctaButton={{
|
||||
text: "Contact Our Team",
|
||||
href: "#",
|
||||
}}
|
||||
ctaIcon={Mail}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactFaq
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "q1", title: "What file types do you accept?", content: "We accept AI, PDF, EPS, and high-res JPEG/PNG." },
|
||||
{ id: "q2", title: "Do you offer shipping?", content: "Yes, we ship nationwide with tracked delivery options." },
|
||||
{ id: "q3", title: "How long is turnaround?", content: "Standard printing is 3-5 business days depending on volume." },
|
||||
]}
|
||||
ctaTitle="Ready to Start Your Project?"
|
||||
ctaDescription="Get in touch today for a free quote on your custom print request."
|
||||
ctaButton={{ text: "Contact Our Team", href: "#" }}
|
||||
ctaIcon={Mail}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="PrintCore"
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "FAQs",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 PrintCore. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="PrintCore"
|
||||
columns={[
|
||||
{ title: "Company", items: [{ label: "About", href: "#about" }, { label: "Services", href: "#services" }] },
|
||||
{ title: "Support", items: [{ label: "Contact", href: "#contact" }, { label: "FAQs", href: "#contact" }] },
|
||||
]}
|
||||
copyrightText="© 2025 PrintCore. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<a
|
||||
href="https://wa.me/yourphonenumber"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="fixed bottom-6 right-6 z-50 flex h-14 w-14 items-center justify-center rounded-full bg-[#25D366] text-white shadow-lg transition-transform hover:scale-110 animate-bounce"
|
||||
aria-label="Chat on WhatsApp"
|
||||
>
|
||||
<MessageCircle className="h-8 w-8" />
|
||||
</a>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #f5f5f5;
|
||||
--card: #ffffff;
|
||||
--foreground: #1c1c1c;
|
||||
--primary-cta: #1c1c1c;
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--foreground: #f5f5f5;
|
||||
--primary-cta: #ffdf7d;
|
||||
--primary-cta-text: #f5f5f5;
|
||||
--secondary-cta: #ffffff;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta-text: #1c1c1c;
|
||||
--accent: #15479c;
|
||||
--background-accent: #a8cce8;
|
||||
--accent: #b8860b;
|
||||
--background-accent: #8b6914;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user